从排队停止滚动功能

我创建了一个带有JavaScript的滚动系统，用于我正在处理的网站，并且在排队所有输入时遇到了一些麻烦。从排队停止滚动功能

下面是我的问题的一个例子，尝试滚动，你会看到问题是什么。 http://fadedmeadows.com/test/

var index = 0; 
 
var scroll2 = true; 
 
$(document).ready(function() { 
 
    $("#home").css({ 
 
    "color": "#eb0e0e", 
 
    }); 
 
}); 
 

 
$(window).bind('mousewheel DOMMouseScroll touchmove', function(event) { 
 
    scroll2 = true; 
 
    if (event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0) { 
 
    // scroll up 
 
    if (index > 4) index = 4; 
 

 
    if (index == 4 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("#content3").offset().top 
 
     }, 1000); 
 
     index--; 
 
     scroll2 = false; 
 
    } 
 
    if (index == 3 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("#content2").offset().top 
 
     }, 1000); 
 
     index--; 
 
     scroll2 = false; 
 
    } 
 
    if (index == 2 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("#content").offset().top 
 
     }, 1000); 
 
     index--; 
 
     scroll2 = false; 
 
    } 
 
    if (index == 1 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("header").offset().top 
 
     }, 1000); 
 
     index--; 
 
     scroll2 = false; 
 
    } 
 
    } else { 
 
    // scroll down 
 
    if (index < 0) index = 0; 
 
    if (index == 0 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("#content").offset().top 
 
     }, 1000); 
 
     index++; 
 
     scroll2 = false; 
 
    } 
 
    if (index == 1 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("#content2").offset().top 
 
     }, 1000); 
 
     index++; 
 
     scroll2 = false; 
 
    } 
 
    if (index == 2 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("#content3").offset().top 
 
     }, 1000); 
 
     index++; 
 
     scroll2 = false; 
 
    } 
 
    if (index == 3 && scroll2 == true) { 
 
     $('html, body').animate({ 
 
     scrollTop: $("#content4").offset().top 
 
     }, 1000); 
 
     index++; 
 
     scroll2 = false; 
 
    } 
 
    } 
 
});

来源

2015-04-12 Kommander Krunt

不知道这是否会帮助你，但我有实际的事件监听器，并设置每当接收到事件的超时。

如果事件在前一个超时过期之前触发，则取消前一个超时。超时实际上触发了这个动作。因此，一系列相继发生的类似事件被沉默并被抛弃。

我主要用于窗口大小调整事件，但它也可能适用于此。纯JS代码可能是这个样子：

var resizeTimeout = null, wait = 200; 
window.onresize = function(){ 
    if (resizeTimeout !== null) { 
    window.clearTimeout(resizeTimeout); 
    resizeTimeout = null; 
    } 
    resizeTimeout = setTimeout(function(){ 
    //do whatever is needed to deal with window resize. 
    }, wait); 
}

（但我有一个包装“类”叫定时器，使其成为一个有点清洁剂来做这种事情）

来源

2015-04-12 18:07:50

我是否能申报“等待“作为一个变量，仍然有这个代码工作？我已经使用类似的语言的JavaScript，所以这种方式奠定了对我来说没有意义。我觉得这是正确的轨道，但它不适合我，我需要尽快完成这个网站，提前谢谢你。 –

没关系我解决了这个问题，非常感谢你的帮助。我希望我可以upvote你，但它不会让我呢。 –

@KommanderKrunt没问题。所以IIUC，你能够将这种方法适用于你的用例？如果是这样，很酷！很高兴它帮助你:) –

从排队停止滚动功能

回答

相关问题