[解決済み] レスポンシブテーブル内のBootstrapボタンのドロップダウンがスクロールのため表示されない
2022-12-15 04:03:59
質問
テーブル内のドロップダウンボタンがレスポンシブでスクロールが有効な場合、以下の理由でドロップダウンが表示されないという問題があります。
overflow: auto;
プロパティのためにドロップダウンが表示されないからです。これが折りたたまれたときにボタンのドロップダウンオプションを表示するには、どのようにそれを修正することができますか?私はいくつかのjQueryを使用することができますが、私は左から右へのスクロールの問題を持っているので、私は別の解決策を見つけることにしました後。
私はよりよく理解するために写真を添付しています。
<イグ
どのように解決するのですか?
私は自分自身でこれを解決し、私は同じ問題を持っている他のユーザーを助けるためにスコープに答えを置く:我々は、ブートストラップでイベントを持っており、我々は設定するために、そのイベントを使用することができます。
overflow: inherit
を設定することができますが、これは親コンテナでcssプロパティを持っていない場合に動作します。
$('.table-responsive').on('show.bs.dropdown', function () {
$('.table-responsive').css( "overflow", "inherit" );
});
$('.table-responsive').on('hide.bs.dropdown', function () {
$('.table-responsive').css( "overflow", "auto" );
})
info:
このフィドル例では奇妙な動作をしますが、なぜか私のプロジェクトではうまく動作します。
関連
-
[解決済み] jQueryでドロップダウンリストの選択値を変更する
-
[解決済み] 配列からオブジェクトを生成する
-
[解決済み] 上級者向けJavaScript。この関数はなぜ括弧でくくられるのですか?重複
-
[解決済み] チェックボックスが選択されているかどうかを確認するjQuery
-
[解決済み] CORS OriginヘッダーとCSRFトークンによるCSRF保護
-
[解決済み] Javascript 空の配列の削減
-
[解決済み] AJAX Mailchimp サインアップフォームの統合
-
[解決済み] JavaScript で css プロパティを使用して HTML 要素の背景色を設定する方法
-
[解決済み] jQueryのバージョン1、バージョン2、バージョン3の違いは何ですか?[クローズド]
-
[解決済み] JavaScriptの文字列プリミティブとStringオブジェクトの違いは何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] 配列からオブジェクトを生成する
-
[解決済み] JavaScript で範囲を作成する - 奇妙な構文
-
[解決済み] なぜJavaScriptでは!{}[true]がtrueに評価されるのですか?
-
[解決済み] javascript の関数から `undefined` と `null` のどちらを返すのが良いのでしょうか?
-
[解決済み] Reactコンポーネントでthis.setStateを複数回使用するとどうなりますか?
-
[解決済み] Javascript / jQueryでAndroid端末を検出する。
-
[解決済み] Javascriptで動的に命名されたメソッドを呼び出すにはどうすればよいですか?
-
[解決済み] ECMAScriptとは?
-
[解決済み] HTML要素にスクロールバーがあるかどうかをチェックする
-
[解決済み] JavaScriptでDIVを表示・非表示にするには?