如何将一个 div 固定在另一个 div 中？答案

【问题标题】：How to position a div fixed inside another div?如何将一个 div 固定在另一个 div 中？
【发布时间】：2013-07-08 10:39:14
【问题描述】：

我有一组引导导航选项卡，在这些选项卡内有很好的长信息部分。问题是我们的团队不希望在这么长的选项卡上包含所有这些信息，因此我们使选项卡容器元素具有溢出：滚动属性。这很好用，但现在我们被一个不可能长的内联滚动部分卡住了，它需要 30-40 个鼠标滚动才能到达底部。这将失去我们的网站流量。

我知道固定位置的定义相对于浏览器窗口是固定的，但我需要一种在父 div 内部使用 bootstrap scrollspy nav-list 菜单的方法，并且不能让它横向移动到外部那个div的。因此，我们需要它的方式与 class="fixed-to-top" 属性的工作方式相同，因此这是一个可运行的导航菜单，但无论我们尝试什么，似乎固定定位总是恢复为相对于浏览器的位置。

有可能做我们想做的事吗？

【问题讨论】：

标签： html twitter-bootstrap css-position fixed

【解决方案1】：

下面的代码不是一个完整的实现，但我希望它能让您了解它是如何完成的。 IE。如果固定的 div 超出其父/容器，则更改位置属性。

var $nlm = $('#navListMenu');
$(window).bind('scroll', function(){
    if($nlm.offset().top < $nlm.parent().offset().top)
        $nlm.css({ position:'absolute', top:0 });
    else 
        $nlm.css({ position:'fixed'});
}

【讨论】：

回答了 :) 非常感谢！