Question

我想创建一个非常缓慢地滚动到底部的网站。

var docEnd= $(document).height();
$('html,body').stop(true,false).animate({scrollTop:docEnd}, 1200000,'linear');

问题是它禁用了用户滚动并且滚动事件lisetener不区分动画和用户滚动。

我需要让用户能够覆盖它：
网页自动滚动到底部 - ＆gt;用户将滚动 - ＆gt;动画停止，用户在任何地方滚动 - ＆gt;当他完成了动画回归。

提前多多感谢！ ROTEM。

Answer 1

var doc=$('html,body');
var docEnd= doc.height();

doc.animate({scrollTop:docEnd}, 120000,'linear');

$(window).scroll($.debounce( 250, true, function(){
    console.log("scrolling");
    doc.clearQueue();
    doc.stop();
} ) );

$(window).scroll($.debounce( 250, function(){
    console.log("done");
    doc.animate({scrollTop:docEnd}, 120000,'linear');
} ) );

这是demo for the code above

它使用debounce插件检查是否滚动。滚动清除队列并停止自动滚动

自动滚动动画禁用用户滚动 - 覆盖它的能力

1 个答案: