2

動的な行数のデータを表示するブートストラップテーブルがあります。最後<td>のトリガーには、クリックするとブートストラップドロップダウンが表示されるトリガーが含まれています。問題は、テーブルの内容が大きくなりすぎると、画面のどこにいても、そのドロップダウンをアクティブにすると、クリック可能なトリガーの下にテーブルが表示されることです。トリガーがページの一番下にある場合、ドロップダウンをクリックするとページの高さが高くなり、ユーザーはドロップダウンの残りの部分を表示するためにもう一度下にスクロールする必要があります。

これには他の影響もあります。たとえば、ビューポートのページの高さがスクロールバーの表示をトリガーし、ページの幅を目立つように減らすという、これまでにないわずかな(しかし厄介な)影響がある可能性がありますが、ドロップダウンの場合のみです。が表示されます。

Twitterブートストラップを使用して、ドロップダウンが実際にはビューポートを超えて垂直方向に伸びていることを認識し、そうなる場合は、代わりに垂直方向に上向きに配置する方法はありますか?class="dropdown pull-up"ブートストラップが、ビューポートの下部を超えてドロップダウン表示を行わないようにするために必要な場合にのみ位置合わせすることを知っているほど賢い、一種の動的なものですか?

4

1 に答える 1

7

はいドロップアップメニュー(このセクションのドロップアップの例を参照)

最新バージョンを使用していることを確認してください

<div class="btn-group dropup">
  <button class="btn">Dropup</button>
  <button class="btn dropdown-toggle" data-toggle="dropdown">
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu">
    <!-- dropdown menu links -->
  </ul>
</div>
于 2013-03-07T20:01:53.883 に答える