2015-03-11 5 views
3

Я пытаюсь плавно прокручивать страницы с помощью setInterval() и window.scrollBy()Smooth Scroll Использование window.scrollBy

Я хотел бы использовать функцию анимации JQuery, но анимация должна быть непрерывной и цикл бесконечно (содержимое страницы будет бесконечным).

Идея довольно проста:

var x = 1; 
var y = 1; 

setInterval(function() { 
    window.scrollBy(0, x); 
}, y); 

Как я могу увеличить скорость прокрутки без анимации появляется нервным?

Я Почувствуйте две проблемы:

  1. setInterval() не может принимать значение Y меньше, чем 1 (или, вероятно, ближе к 30, в зависимости от ограничений браузера)
  2. Увеличение значения Х вызывает анимацию, чтобы быть нервной (из-за пиксели пропуска вообще)

Вот скрипка экспериментировать с:

http://jsfiddle.net/eoojrqh6/2/

Спасибо!

+0

Я пытаюсь сделать что-то вот так: http://skifreeonline.com/ – coryetzkorn

ответ

1

Вместо window.scrollBy вы можете использовать window.scroll.

http://jsfiddle.net/peterdotjs/f7yzLzyx/1/

var x = 1; //y-axis pixel displacement 
var y = 1; //delay in milliseconds 

setInterval(function() { 
    window.scroll(0, x); 
    x = x + 5; //if you want to increase speed simply increase increment interval 
}, y); 

Как вы в настоящее время имеете y значения, установленные очень низкое, вы можете настроить значения y и добавочную стоимость x найти желаемую скорость прокрутки.

+0

Спасибо! Кажется, это хорошо работает. Похоже, трюк держит, что значение Y как можно меньше. Я буду отмечать это как ответ после некоторого тестирования. – coryetzkorn

0

Альтернативный метод простой прокрутки на любой странице одним щелчком мыши, я создал закладку, которую я разместил на панели инструментов закладок, чтобы она всегда была видимой и доступной одним щелчком мыши. Затем я только что отредактировал его свойства с помощью этого кода, который просто автоматически прокручивает страницу при нажатии, если страница не является автоматической прокруткой. Если он уже автоматически прокручивается, он просто останавливает его, поэтому вы можете включить автоматическую прокрутку и отключить автопрокрутку, просто щелкнув по нему. Вот код, который я сохранил в закладке в качестве местоположения, просто скопируйте следующий код, а затем откройте любой браузер, щелкнув правой кнопкой мыши на любых существующих закладках на панели инструментов и свойствах goto, затем вставьте код или создайте новую закладку и вставьте код в качестве места при использовании Firefox

JavaScript: вар% 20isScrolling;% 20var% 20scrolldelay;% 20function% 20pageScroll()% 20% {20window.scrollBy (2,1);% 20scrolldelay% 20% = 20setTimeout ('pageScroll()' ,. 1);% 20isScrolling% 20% = 20true;% 20%} 20if (! isScrolling% 20% = 20true)% 20% {20pageScroll();}% 20% 20% 20else {% 20isScrolling% 20% = 20false;% 20clearTimeout (scrolldelay);% 20}


Для Internet Explorer & Chrome, используйте этот код, который не содержит% 20 для пространств

JavaScript: вар isScrolling; var scrolldelay; function pageScroll() {window.scrollBy (0,1); scrolldelay = setTimeout ('pageScroll()', 15); isScrolling = true; } if (isScrolling! = true) {pageScroll(); } else {isScrolling = false; clearTimeout (scrolldelay); }

Просто измените значения для изменения скорости в соответствии с вашими предпочтениями за то, что выглядит лучше всего на вашем компьютере, так как эффект не будет таким же unanymously для каждого дисплея