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 に答える