Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to auto-scroll div content vertically continuously

I need to scroll the div which contains images, vertically. Any help or references will be highly appreciated.

like image 873
Rajasekar Avatar asked Dec 10 '09 13:12

Rajasekar


1 Answers

Maybe something like this would help? First and last images are supposed to be the same.

JS:

(function(){
  var box=document.getElementById('box');
  box.appendChild(box.firstChild.cloneNode());    

  function infScroll(){
    box.scrollTop +=1;
    if(box.scrollTop===300){
        box.scrollTop=0;
    }
    window.requestAnimationFrame(infScroll);
  }
  window.requestAnimationFrame(infScroll);
}());

HTML:

<div id="box" style="width:150px; height:100px; overflow:hidden;">
    <img src="http://placekitten.com/150/90" />
    <img src="http://placekitten.com/150/120" />
    <img src="http://placekitten.com/150/80" />
    <img src="http://placekitten.com/150/90" />
</div>
like image 133
Yasin Bahtiyar Avatar answered Oct 23 '22 11:10

Yasin Bahtiyar