Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.02.2016, 17:31
Аватар для Leon-on12
Аспирант
Отправить личное сообщение для Leon-on12 Посмотреть профиль Найти все сообщения от Leon-on12
 
Регистрация: 07.04.2015
Сообщений: 65

Анимация scrollа с инерцией.
У меня есть различные массивы и ограничения что бы работала нормально но тут самая выжимка без лишних вещей.
Вопрос в том как устроить плавную анимацию дальнейшей прокрутки.
function down(evt) {
	evt = (evt || event);
	yDown = evt.pageY;
	tDown = new Date().getTime();
}
function up(evt) {
	evt = (evt || event);				
	time = new Date().getTime() - yDown;
	y = yDown - evt.pageY;
	speed = (y/time);            
	
}
function scroll(){

//??
document.getElementById("Scroll").style.marginTop = marginTop - speed*100;
speed = 0.9*speed;
//??

}

Вопрос как правильно сделать цикл выполнения scroll() до тех пор пока speed не станет 0 .
С самого начала у маня был setIterval который работал всё время.
document.getElementsByTagName("body")[0].ready = (setInterval('scroll()', 41)
По тому же принципу можно постоянно чистить этот интервал если speed < 0 и запускать заново на up(evt).

Попробовал зациклить setTimeout() вызовом в конце.
function scroll(){
document.getElementById("Scroll").style.marginTop = marginTop - speed*100;
speed = 0.9*speed;
if(speed > 0)setTimeout('scroll();',41)
}


Придумал даже такой ужас, но так и не рискнул проверить работоспособность.
for (var i=0;i <inumber;i++){
            setTimeout('scroll();',41*i)
};


Как лучше делать подобную плавную анимацию?
Задача для мобильного браузера. По этому как загрузить его как можно меньше?
Ответить с цитированием
  #2 (permalink)  
Старый 02.02.2016, 17:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Leon-on12,
всё что требуется здесь
js-animation
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
CSS3 Анимация [Не срабатывает при переключении вкладки] Quasar[CY] (X)HTML/CSS 1 18.11.2015 20:43
Анимация после анимации Narahon Элементы интерфейса 12 02.04.2015 22:06
Анимация gif картинки при нажатии на ссылку ainur777 Общие вопросы Javascript 2 06.07.2014 16:23
Анимация. Помогите понять почему не работает. kadurban jQuery 4 08.07.2010 20:50
Цикличность анимация? SashaBorandi jQuery 1 25.12.2008 09:20