2011-09-06 126 views
5

我得到这个简单的脚本来了网页向下滚动页面自动直到用户滚动起来

function scrollDown() { 
    window.scrollBy(0,50); // horizontal and vertical scroll increments 
} 

scrolldelay = setTimeout('scrollDown()',100); // scrolls every 100 milliseconds 

滚动我现在想拦截当用户滚动了自己与

停止的setTimeout
clearTimeout(scrolldelay); 

任何想法? 优选纯JS

公认的答案另一种是在这里:http://jsfiddle.net/Vy8tW/

回答

4
var start = (function() { 
    function scrollTop() { 
     return window.scrollTop || document.body.scrollTop || (document.documentElement && document.documentElement.scrollTop) 
    } 

    var top = scrollTop(); 
    var interval; 
    window.onscroll = function() { 
     var newtop = scrollTop(); 
     if (newtop < top) { 
      clearInterval(interval); 
     } 
     top = newtop; 
    }; 
    return function() { 
     interval = setInterval(function() { 
      window.scrollBy(0, 50); 
     }, 100); 
    } 
}()); 

start(); 

它是如何工作的:每个页面滚动的时候,它目前的scrollTop的比较前一个。如果我们检测到页面已经滚动,我们会停止该时间间隔。

您可以通过再次调用start()来重新开始滚动。

试试看:http://jsfiddle.net/fR9Wt/3/

+0

完美的解决方案,虽然在这种情况下我更喜欢简单的代码。我用onmousewhell – dynamic

+0

写了这个http://jsfiddle.net/Vy8tW/好的解决方案。然而,不会与pageup/pagedown键一起使用;) – arnaud576875

+0

当然,只能与whell一起工作,但这不是问题 – dynamic

1

您需要捕获来自用户的滚动事件。

如果你正在使用jQuery(或者类似的库,它提供了类似的功能),您可以用.scroll()来检测

$('#target').scroll(function() { 
    clearInterval(scrolldelay); 
}); 

否则,你就需要自己捕获滚动事件。如果这旨在跨浏览器使用,则事件命名方案将针对标准浏览器进行“滚动”,对于IE则为“onscroll”。

这个页面有一些非常基本的例子,http://help.dottoro.com/ljurkcpe.php

+0

我只需要镀铬。我认为我可以使用onmousewheel来保证我的scrollDown函数不会被触发 – dynamic

+1

window.scrollBy()触发滚动事件;-) – arnaud576875