1

我有一个脚本，它在滚动时触发 HTML5 应用程序中的各种淡入淡出/菜单显示 - 该脚本是通过 IScroll 的滚动高度触发的，如下所示 -

onScrollMove: function() {
           var thisScrol =  myScroll.getScrollY()

           if (thisScrol < -70 ){
                bgfadeToggle('on');
                notifToggle('on');

            }
            if (thisScrol > -70){
                bgfadeToggle('off');
                notifToggle('off');

            }



},

供参考的功能如下 -

 function notifToggle(whichOne){

if (whichOne == "on" && fifth == "yes"){

    setTimeout(function() {fifth="no";}, 10)
        $('.notificationArea .notif').animate({

                    opacity: 0
                  }, 1500);

}
if (whichOne == "off" && fifth == "no"){

    setTimeout(function() {fifth="yes";}, 10)
        $('.notificationArea .notif').animate({

                    opacity:1
                  }, 2500);


}

}


//Move footer ul depending on scroll position
function bgfadeToggle(which){
if (which == "on" && first == "yes"){

    setTimeout(function() {first="no";$('#wrapper').addClass('hov');  }, 10)

                $('.appearLate').fadeIn('1000');

                $('.footer ul ').animate({
                    bottom: [ "-40", "linear" ],
                    opacity: "0"
                  }, 100, "linear");


                $( ".appearLate" ).animate({
                    top: [ "-1", "swing" ],
                    opacity: "1"
                  }, 500, "linear");

}

该脚本效果很好-除非..您快速上下滚动-同时触发两个脚本-这意味着事情会在错误的时间淡出并再次出现-有什么办法可以阻止脚本像这样做出反应-即在另一个功能运行时禁用一个功能？

有任何想法吗？

4

1 回答 1

4

用于stop()停止当前正在运行的动画

  $('.notificationArea .notif').stop().animate({
                opacity: 0
              }, 1500);

或者

stop(true,true)

如果参数为 true，则队列中的其余动画将被删除并且永远不会运行stop(true,true)。通常在这种情况下使用

于 2013-09-03T09:11:51.907 回答