标签:
<html> <head> <title>scroll up auto smooth</title> <style> *{ margin: 0; padding: 0; list-style: none; } #scroll_outer{ width: 300px; height: 90px; margin: 30px auto; overflow: hidden; background-color: #f4f4f4; } #scroll_inner{ width: 100%; } .scroll_inner ul li{ height: 29px; line-height: 29px; border-bottom: 1px solid #d4d4d4; } </style> </head> <body> <div id="scroll_outer"> <div class="scroll_inner"> <ul> <li>this is news list items up 1</li> <li>this is news list items up 2</li> <li>this is news list items up 3</li> <li>this is news list items up 4</li> <li>this is news list items up 5</li> <li>this is news list items up 6</li> </ul> </div> </div> <script> window.onload = function(){ var scrollOuter = document.getElementById("scroll_outer"); //get scroll_outer object var innerElement = scrollOuter.innerHTML; //get scroll_outer innerHTML scroll_outer.innerHTML = innerElement + innerElement; //rewrite scroll_outer innerHTML to be deboule elements var scrollInner = document.getElementsByClassName("scroll_inner")[0]; //get scroll_inner object setInterval(scrollUp,50); function scrollUp(){ if(scrollInner.offsetHeight == scrollOuter.scrollTop){ scrollOuter.scrollTop = 0; } scrollOuter.scrollTop += 1; } } </script> </body> </html>
标签:
原文地址:http://www.cnblogs.com/sunbey/p/5123998.html