1

jsFiddle：http: //jsfiddle.net/2ezQ9/2/

在我的网站上，我使用 NiceScroll3 在容器 div 中有一个滚动条，它使用 AJAX 提取数据。我的问题是这样的：当我滚动到容器 div 的顶部时，滚动条本身继续在标题下滚动到容器的顶部。这是正常的，我知道，但我希望滚动条在容器完成滚动时停止在标题的底部。基本上，我希望滚动条以与我的标题高度相同的上边距停止（即：不与标题重叠）。我无休止地搜索，无法在线找到解决方案。先感谢您！

HTML

<div id="wrapper">
<div id="header">STICKY HEADER</div>
<div id="content">CONTENT
<br />CONTENT<br />CONTENT<br />CONTENT <br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT <br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />CONTENT<br />
</div>
<div class="push"></div>
</div>

CSS

#wrapper {
    padding: 0;
    height: auto; !important;
    position: relative;
    margin: 0;
    width: 100%;
    top:0;
}
#header {   
    position: fixed;
    z-index: 1;
    margin: 0;
    padding: 0;
    left: 0;
    height: 40px;
    width: 100%;
    background-color: blue;
}
#content {
    padding: 5px;
    padding-top: 44px;
    filter: alpha(opacity=50);
    max-width: 1105px;
    border: 1px solid #333333;
    margin-right: auto;
    background:#252525;
}
4

1 回答 1

0

如果我正确理解您的问题，您可以使用 jQuery 滚动事件，而不是让标题的高度像这样传递：http: //jsfiddle.net/2ezQ9/4/

$(window).scroll(function () {
    if ($(this).scrollTop() < 58) {
        $(this).scrollTop(58);
    }
});
于 2013-05-09T22:22:43.767 回答