scrollTop无缝滚动
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>无标题文档</title> 6 <style> 7 *{margin:0;padding:0;} 8 ul{list-style:none;} 9 #box{width:100px;height:200px;overflow:hidden;margin:30px;} 10 .main{height:800%} 11 </style> 12 <script> 13 window.onload=function() 14 { 15 var oBox = document.getElementById('box'); 16 var oScroll = document.getElementById('scroll'); 17 var timer = null; 18 oScroll.innerHTML+=oScroll.innerHTML; 19 function marquee() 20 { 21 if(oScroll.offsetHeight/2 - oBox.scrollTop <= 0) 22 { 23 oBox.scrollTop -= oScroll.offsetHeight; 24 } 25 else 26 { 27 oBox.scrollTop++; 28 document.title=oBox.scrollTop; 29 }; 30 }; 31 timer = setInterval(marquee,20); 32 }; 33 34 </script> 35 </head> 36 37 <body> 38 <div id="box"> 39 <div class="main"> 40 <ul id="scroll"> 41 <li>dasdasdasd</li> 42 <li>2222222222</li> 43 <li>dasdasdasd</li> 44 <li>111111111111</li> 45 <li>dasdasdasd</li> 46 <li>dasdasdasd</li> 47 <li>33333333333</li> 48 <li>dasdasdasd</li> 49 <li>44444444444</li> 50 <li>dasdasdasd</li> 51 </ul> 52 </div> 53 </div> 54 </body> 55 </html>