3

我使用这个脚本:

<script>
    $(function() {
        var offset = $("#menu_border").offset();
        var topPadding = 20;
        $(window).scroll(function() {
            if ($(window).scrollTop() > offset.top) {
                $("#menu_border").stop().animate({
                    marginTop: $(window).scrollTop() - offset.top + topPadding
                });
            } else {
                $("#menu_border").stop().animate({
                    marginTop: 0
                });
            };
        });
    });
    </script>

当用户滚动时,它使我的 $menu_border 跟随窗口。问题是,我在这个“下面”有一个 div,当用户(屏幕分辨率低于 1080)滚动到页面底部时,这个脚本只是继续向下推 #menu_border,使页面更长并且更长。

所以问题是;有没有简单的方法让它停在某个点?最好的事情是在容器内(在这种情况下为#container_div)。

希望我让自己明白。

最好的祝福!

4

1 回答 1

2

您需要停止添加到边距的时刻值$(window).scrollTop()与 #menu_border 的高度相结合超过身体的高度。

这是我的头等大事,我没有现场尝试,但将您的第一个条件更改为:

if ($(window).scrollTop() > offset.top && 
    ($(window).scrollTop() + $('#menu_border').outerHeight() <=  $('BODY').height()) {

代替

if ($(window).scrollTop() > offset.top)

应该做的伎俩。根据您是否在 #menu_border 上有填充,您可能想要使用$('BODY').outerHeigh()而不是$('BODY').height().

让我知道你是否做到了。

于 2012-10-10T23:13:46.907 回答