0

特定のスクロールが発生した後、固定位置を取得するために2divを必要とするページがあります。問題は、同じdivに配置できないため、それぞれに2つの異なるコードを使用する必要があることです。

これは私が使用するjqueryコードです。

<script>
$(document).ready(function() {
    if (window.XMLHttpRequest) {
    window.onscroll = function() {
        if ($('body').scrollTop() > 534 || $('html').scrollTop() > 534) {
            if ($(window).height() > 20) {
                $('#wrappernav').addClass('wrappernavstatic');
            }
        }
        else {
            $('#wrappernav').removeClass('wrappernavstatic');
        }
    };
    }
});

そして、別のdiv用に250px用にもう1つ追加する必要があります。しかし、両方を同じページに置くと、競合し、2番目のページだけが最初の詳細を処理しています。

<script>
$(document).ready(function() {
    if (window.XMLHttpRequest) {
    window.onscroll = function() {
        if ($('body').scrollTop() > 300 || $('html').scrollTop() > 300) {
            if ($(window).height() > 20) {
                $('#wrappernavfilter').addClass('wrappernavfilterstatic');
            }
        }
        else {
            $('#wrappernavfilter').removeClass('wrappernavfilterstatic');
        }
    };
    }
});

どうすれば両方を混ぜてアクティブにすることができますか？

4

1 に答える 1

1

.scroll()両方のハンドラーをバインドするために使用できます。

$(window).scroll(function () {
    // ...
});

1 つだけに限定されるのではなく、次のようにしwindow.onscrollます。

window.onscroll = function () {
    // ...
};

したがって、質問の最初のスニペットの場合:

<script>
$(document).ready(function() {
    if (window.XMLHttpRequest) {
        $(window).scroll(function() {
            if ($('body').scrollTop() > 534 || $('html').scrollTop() > 534) {
                if ($(window).height() > 20) {
                    $('#wrappernav').addClass('wrappernavstatic');
                }
            }
            else {
                $('#wrappernav').removeClass('wrappernavstatic');
            }
        });
    }
});
于 2012-05-15T17:44:57.350 に答える