0

この awnser に基づいて: jQuery スクロール イベントの方向を判断するにはどうすればよいですか?

私はこのような機能をしました：

tempScrollTop=0;
$.fn.cool = function(options){
    windowTop = $(window).scrollTop(); 

    if (tempScrollTop < windowTop ){
        //scroll down
    }
    else if (tempScrollTop > windowTop ){
        //scroll up
    }

    tempScrollTop = windowTop;
};

しかし、関数を使用しようとするたびに

 $(window).scroll(function(e) {
    $("#element1").cool();
    $("#element2").cool();
 }

$("#element2") は $("#element1") によって既に変更されたグローバル変数 tempScrollTop を取り、要素 2 の tempScrollTop と windowTop は同じ値を持つため、関数は機能しません。

私に何ができるかについてのアイデアはありますか？要素ごとにn個の関数を作成したくありません。

4

2 に答える 2

1

あなたが実際にやりたいことは次のようです：

$("#element1","#element2").cool();

次に、クールな関数で：

tempScrollTop=0;
$.fn.cool = function(options){
windowTop = $(window).scrollTop(); 

if (tempScrollTop < windowTop ){
    //scroll down
    this.each(function() {
        // do stuff with each selected element $(this)
    });
}
else if (tempScrollTop > windowTop ){
    //scroll down
    this.each(function() {
        // do stuff with each selected element $(this)
    });
}

tempScrollTop = windowTop;
};

プラグイン オーサリングの詳細については、こちらを参照してください。

もう 1 つの方法は、要素に対するアクションからスクロールの計算を分離することです。

$(window).scroll(function(e) {
    var scrollDiff=calculateScroll();
    $("#element1").cool(scrollDiff);
    $("#element2").cool(scrollDiff);
}
于 2012-12-04T16:10:57.443 に答える
0 
var tempScrollTop = 0,
    innerScrollTop;
    $.fn.cool = function(options){
        var $this = $(this);
        innerScrollTop = $this.data('scrollTop') || tempScrollTop;

        windowTop = $(window).scrollTop();

        if (innerScrollTop <= windowTop ){
            //scroll down
        } else {
            //scroll up
        }

        $this.data('scrollTop', windowTop);
    };
于 2012-12-04T16:03:54.360 に答える