Twitter Bootstrap从底部对齐下拉框

我有一个引导表显示数据的动态行数。最后的<td>包含一个触发器，点击后会显示引导程序下拉列表。问题在于，当表格的内容变得太大时，激活该下拉菜单会将其显示在可点击的触发器下方，而不管它在屏幕上的哪个位置。如果触发器位于页面的最底部，点击时下拉菜单会增加页面高度，用户将不得不再次向下滚动才能看到下拉菜单的其余部分。Twitter Bootstrap从底部对齐下拉框

这也有其他的影响，比如它可能会有这么轻微（但恼人）的效果，即视口的页面高度会触发滚动条的显示，减少页面的宽度足够明显，但只有当下拉菜单可见时才会显示。

有没有什么方法可以使用twitter引导让下拉菜单识别它实际上会垂直延伸到视口之外，如果它将会呈现垂直向上的对齐方式吗？一种动态的class="dropdown pull-up"，其中bootstrap足够聪明，知道只有在必要时才对齐，以使下拉显示不超过视口的底部？

来源

2013-03-07 Scott

你可以请张贴代码。 – Shail 2013-03-08 02:08:58

是Dropup menus（请参见本节的降幅高达为例）

确保您使用的是最新版本的

<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-07 20:01:53 bleuscyther

这是我的一个有趣的疏忽。它似乎缺乏的唯一方法是区分是否需要使用下拉菜单或dropup来保持菜单（完整）在视口内的自动方式。我是否正确认为我需要使用JavaScript从外部引导来处理？ – Scott 2013-03-07 20:23:44

他们刚刚添加它。（'#mydiv'）。click（function（if（（''#mymenu'）。height（）。replace（'px'））如果你想要使用JavaScript来添加类.dropup并移除.dropdown，，''）> 98）... $（'＃mymenu'）。removeClass（'。dropdown'）; $（'＃mymenu'）。addClass（'。dropup'）; ... – bleuscyther 2013-03-07 21:02:37

Twitter Bootstrap从底部对齐下拉框

回答

相关问题