javascript无缝滚动

1 <marquee loop="-1" onmouseover="this.stop();" onmouseout="this.start();"></marquee>

 1 <div  id="moocBox">
 2     <ul id="con1">
 3         <li><a href="#">1.学会html5 绝对的屌丝逆袭（案例）</a><span>2013-09-18</span></li>
 4         <li><a href="#">2.tab页面切换效果（案例）</a><span>2013-10-09</span></li>
 5         <li><a href="#">3.圆角水晶按钮制作（案例）</a><span>2013-10-21</span></li>
 6         <li><a href="#">4.HTML+CSS基础课程(系列)</a><span>2013-11-01</span></li>
 7         <li><a href="#">5.分页页码制作（案例）</a><span>2013-11-06</span></li>
 8         <li><a href="#">6.导航条菜单的制作（案例）</a><span>2013-11-08</span></li>     
 9     </ul>   
10 </div>

1 /*  中间样式 */
2 #moocBox {
3     height: 144px;
4     width: 335px;
5     margin-left: 25px;
6     margin-top: 10px;
7     overflow: hidden;    /*  这个一定要加，超出的内容部分要隐藏，免得撑高中间部分 */
8 }

 1    var area = document.getElementById(‘moocBox‘);
 2       var con1 = document.getElementById(‘con1‘);  
 3       var speed = 50;
 4       area.scrollTop = 0;    
 5       con1.innerHTML += con1.innerHTML;     
 6       function scrollUp() {       
 7           if (area.scrollTop >= con1.scrollHeight/2) {
 8               area.scrollTop = 0;
 9           } else {
10               area.scrollTop++;
11           }
12       }
13       var myScroll = setInterval("scrollUp()", speed);
14       area.onmouseover = function () {
15           clearInterval(myScroll);
16       }
17       area.onmouseout = function () {
18           myScroll = setInterval("scrollUp()", speed);
19       }