2 
<script type="text/javascript">
function scrollFunc(e) {
userScroll=true;
    if ( typeof scrollFunc.x == 'undefined' ) {
        scrollFunc.x=window.pageXOffset;
        scrollFunc.y=window.pageYOffset;
    }
    var diffX=scrollFunc.x-window.pageXOffset;
    var diffY=scrollFunc.y-window.pageYOffset;
if(userScroll)
{
if( diffY<0 ) {
         $(".myCar").animate({"top": "+=50px"},1000);// Scroll down
        alert('down');
        //$(".myCar").stop();
    } else if( diffY>0 ) {
        $(".myCar").animate({"top": "-=50px"},1000);

        alert('Up');// Scroll up
    } else {
        // First scroll event
    }
    userScroll=false;
}
else
{

}
    scrollFunc.x=window.pageXOffset;
    scrollFunc.y=window.pageYOffset;
}
window.onscroll=scrollFunc
</script>

我正在尝试检测，向上和向下滚动，但是，它显示两者的警报消息，我的意思是，如果我向下或向上滚动，它显示两个警报消息。需要帮忙。！！

4

1 回答 1

1

您的代码对我来说很好（在 Opera 和 Firefox 中测试）。但是，查看您的代码，我猜您希望onscroll每个滚动“动作”只触发一次事件，而不是多次触发。

如果这是您的意图，您可以使用本文scrollstart中描述/实现的自定义和scrollstop事件...

function animateCar(upDown) {
    $(".myCar").animate({"top": (upDown == 1) ? "+=50px" : "-=50px"}, 1000);
}

(function(){
    var lastScrollTop = 0;
    $(window).on("scrollstart", function(){
        lastScrollTop = $(this).scrollTop();
    });
    $(window).on("scrollstop", function(){
        animateCar(lastScrollTop - $(this).scrollTop() > 0 ? -1 : 1);
    });
})();

演示（JSFiddle）


如果您想保留代码的原始行为，可以使用 jQuery 重写它 - 也许它可以解决您遇到的错误：

$(window).scroll((function(){
    var lastScrollTop = 0;
    return function(){
        $(".myCar").animate({"top": (lastScrollTop - $(this).scrollTop() < 0) ? "+=50px" : "-=50px"}, 1000);
        lastScrollTop = $(this).scrollTop();
    };
})());
于 2012-08-18T16:27:01.947 回答