Как прокрутить div с помощью Zepto.js?

Question

У меня есть div с overflow:scroll, и теперь я хочу программно прокрутить этот div вниз. Возможно ли это с Zepto.js?

Answer 1

API не предоставляется непосредственно Zepto, но доступен из нижнего уровня DOM.

var $el = $('#scrolling-el'); 
var el = $el[0]; /* Actual DOM element */ 

/* Scroll to bottom */ 
el.scrollTop = el.scrollHeight - $el.height(); 

/* Scroll to top */ 
el.scrollTop = 0; 

анимированные прокрутки будет процесс использования setTimeout. Вы можете написать быстрый плагин Zepto. Ниже приведен пример:

$.fn.scrollToBottom = function(duration) { 
    var $el = this; 
    var el = $el[0]; 
    var startPosition = el.scrollTop; 
    var delta = el.scrollHeight - $el.height() - startPosition; 

    var startTime = Date.now(); 

    function scroll() { 
     var fraction = Math.min(1, (Date.now() - startTime)/duration); 

     el.scrollTop = delta * fraction + startPosition; 

     if(fraction < 1) { 
      setTimeout(scroll, 10); 
     } 
    } 
    scroll(); 
};