Автоматическая прокрутка страницы или блока может быть полезна при постоянном выводе контента (чат, постоянный вывод текста и т.д.), сделать такую прокрутку легко:
setInterval(function() {
window.scrollTo(0, document.body.scrollHeight);
}, 1000);animate(): setInterval(function(){
$('html,body').animate({scrollTop: $('html,body').get(0).scrollHeight}, 1000);
}, 1000);Но данные примеры не позволят прокрутить страницу вверх, ползунок всегда будет возвращаться вниз. Поэтому необходимо выключать автопрокрутку при скроллинге.
Автопрокрутка всей страницы
var timer;
var isPaused = false;
$(window).on('wheel', function(){
isPaused = true;
clearTimeout(timer);
timer = window.setTimeout(function(){
isPaused = false;
}, 1000);
});
window.setInterval(function(){
if(!isPaused){
window.scrollTo(0, document.body.scrollHeight);
}
}, 500);Результат:
Пример для div-блока
<div id="box">...</div>#box {
border: 1px solid #ddd;
padding: 0 20px;
overflow: auto;
height: 150px;
}var timer;
var isPaused = false;
$(window).on('wheel', function(){
isPaused = true;
clearTimeout(timer);
timer = window.setTimeout(function(){
isPaused = false;
}, 1000);
});
window.setInterval(function(){
if(!isPaused){
$("#box").scrollTop($("#box")[0].scrollHeight);
}
}, 500);
Как выключать автопрокрутку при скроллинге?
Авторизуйтесь, чтобы добавить комментарий.