下面是例子代码部分：
**inde.html主要代码** <div class="box" id="box"> <div class="img"><img src="0.jpg" alt="**"></div> </div> **reset.css代码** *{ padding: 0; margin: 0; } a{ text-decoration: none; } #box{ margin: 0 auto; margin-top: 200px; width: 200px; height: 30px; border: 1px solid black; vertical-align:top; overflow:hidden; } .img{ position:absolute; } img{ width: 25px; height: 25px; } .ul{ margin-top:0; display: inline-block; } .ul li{ list-style:none; margin-left:40px; font-size: 16px; height: 30px; line-height:30px; } **main.js代码** ///创建信息 function updateGunping(num){//消息条数 var box=document.getElementById("box"); var ul=document.createElement("ul"); ul.className="ul"; box.appendChild(ul); for(var i=0;i<num;i++){ var li=document.createElement("li"); li.className="li"; ul.appendChild(li); var a=document.createElement("a"); a.className="a"; a.href="#"; li.appendChild(a); a.innerHTML="消息:特大消息--"+Math.floor(Math.random()*10); } } updateGunping(10); //滚动 function move(num){//消息条数 var ul=document.getElementsByTagName("ul")[0]; var n=ul.style.marginTop; var value = n.replace(/[^0-9]/ig,""); //利用正则提取字符串中的数字 console.log(value); if(value>30*(num-2)){ ul.style.marginTop=0; console.log(ul.style.marginTop); }else{ console.log(ul.style.marginTop); ul.style.marginTop=(-value-30)+'px'; console.log(ul.style.marginTop); } } setInterval("move(10)",1500);