Question

基于此awnser：How can I determine the direction of a jQuery scroll event?

我做了这样的功能：

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具有相同的值，因此我的函数不起作用。

关于我该怎么做的任何想法？我不想为每个元素创建一个函数。

Answer 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;
};

有关插件创作here的更多信息。

另一种方法是将滚动计算与元素上的操作分开：

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

Answer 2

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);
    };

Jquery：函数使用相同的全局变量搞乱我的代码

2 个答案: