Прокрутка с анимацией - PullRequest
       21

Прокрутка с анимацией

5 голосов
/ 03 ноября 2010

Мне нужно выполнить javascript метод scrollTo (x, y) с анимацией. Я не могу использовать JQuery, чтобы сделать это.

Ответы [ 2 ]

9 голосов
/ 03 ноября 2010

[ Рабочая демонстрация ]

function interpolate( source,target,pos ) { 
  return ( source + (target - source) * pos ); 
}

function easing( pos ) { 
    return ( -Math.cos( pos * Math.PI ) / 2 ) + 0.5; 
}

function scrollTop( duration ) {

  duration = duration || 1000;

  var startY = window.pageYOffset,
      start  = Number(new Date()),
      finish = start + duration;

  var interval = setInterval(function() {

    var now = Number(new Date()),
        pos = (now > finish) ? 1 : (now - start) / duration;

     scrollTo(0, interpolate( startY, 0, easing(pos) ));

     if ( now > finish )
       clearInterval( interval );
  }, 15);
};
2 голосов
/ 03 ноября 2010

Вы можете анимировать (почти) что угодно в Javascript, используя вызовы window.setTimeout () и window.clearTimeout ().Смотри http://www.w3schools.com/js/js_timing.asp

...