<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Scroll</title> <style type="text/css"> dl,dt,dd{margin: 0px ;padding: 0px} #container{position:relative;margin: 50px auto;width: 100px;border:10px solid #D4D4D4;height: 180px;overflow: hidden;} dl{} dl .text,dd .text{ height: 29px;line-height: 29px;border-bottom: 1px solid #D4D4D4;text-align: center;} </style> </head> <body> <dl id="container"> <dt class="orign"> <div class="text">1</div> <div class="text">2</div> <div class="text">3</div> <div class="text">4</div> <div class="text">5</div> <div class="text">6</div> </dt> <dd class="ling"> </dd> </div> <script type="text/javascript"> window.onload=function(){ var container=document.getElementById("container") var original = document.getElementsByTagName("dt")[0]; var clone = document.getElementsByTagName("dd")[0]; clone.innerHTML=original.innerHTML; var interval=setInterval(function(){ if(container.scrollTop == clone.offsetTop){ container.scrollTop = 0; }else{ container.scrollTop++; } },20); } </script> </body> </html>