超时后自动滚动

我有一个id为list的元素，我想要自动滚动到底部，然后回到顶部连续，但应停止滚动以允许用户控制滚动。经过一段时间，用户没有在元素上出现"mousemove mousedown"，元素应该开始再次自动滚动。超时后自动滚动

我在管理超时（自动向下滚动后自动向上滚动）和间隔（用于继续自动滚动向上和向下）以及“mousemove mousedown”事件并在这些事件发生后停止动画时遇到困难。我的代码是一团糟。

我向下滚动：

$("#list").animate({ 
scrollTop : $("#list")[0].scrollHeight 
}, timeDown);

向上滚动：

$("#list").animate({ 
    scrollTop : 0 
}, timeUp);

来源

2013-06-25 John

http://jsbin.com/oqadud/3/edit

$list = $('#list'); 
$listSH = $list[0].scrollHeight - $list.outerHeight(); 

function loop(){ 
    var t = $list.scrollTop(); 
    $list.stop().animate({scrollTop : !t ? $listSH : 0 }, 2000, loop); 
} 
loop(); 

$list.on('mouseenter mouseleave', function(e){ 
    return e.type=="mouseenter"? $list.stop() : loop(); 
});

$listSH实际上将返回可用scrollHeight属性，不是你可以使用animate回调召回将循环ou的function loop() r动画。

的loop我们只需要获得当前$list.scrollTop();位置内 - 在鼠标离开或任何其他情况的情况下，所以我们可以问一个ternary operator (? :)什么的情况下，布尔!t (is0==false)动画到$listSH其他动画到0做。

在DOM准备调用/启动loop()

和'mouseenter mouseleave'抢事件，并再次三元运营商里面做：
IF事件== mouseenter：.stop()任何动画
ELSE：重新启动我们的loop()功能（正如我所说，从目前的scrollTop()）。

来源

2013-06-25 14:27:41

这太好了。我正在寻找一个超时而不是mouseenter mouseleave。我只是在settimeout中添加的。我将如何去设置自动滚屏的时间和自动滚屏的时间？ – John

@匿名时间？ YOu可以根据需要更改'2000' –

我希望分开上下滚动速度。我想到了，但我只是添加了一个三元运算符：！t？ timeDown：2000年的时间。 – John

超时后自动滚动

回答

相关问题