個(gè)人覺得復(fù)制元素哪里改成area.innerHTML=area.innerHTML+area.innerHTML;這樣比較好
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無縫滾動(dòng)agin</title>
<style>
* {
?? ?margin: 0px;
?? ?padding: 0px;????????? ?
}
#s_box{
?? ?width:399px;
?? ?border:5px solid #ccc;
?? ?margin:0 auto;
?? ?border-radius:8px;
}
#s_box h3{
?? ?width:399px;
?? ?float:left;
?? ?background: #f05e6f;
?? ?line-height:62px;
?? ?border-radius: 4px 4px 0 0;
?? ?color:#fff;
?? ?text-indent:10px;
}
#s_list{
?? ?height:216px;
?? ?width: 335px;
?? ?margin-left: 25px;
?? ?margin-top: 10px;
?? ?overflow: hidden;
}
#s_list ul li{
?? ?list-style:none;
?? ?font-size:12px;
}
#s_list ul li a{
?? ?width: 180px;
?? ?float: left;
?? ?display: block;
?? ?overflow: hidden;
?? ?text-indent: 15px;
?? ?text-decoration:none;
?? ?color:#000;
?? ?line-height:24px;
?? ?height:24px;
}
#s_list ul li a:hover{
?? ?color:#CC0;
}
#s_list ul li span{
?? ?float:right;
?? ?line-height:24px;
?? ?height:24px;
}
</style>
</head>
<body>
<div id="s_box">
?? ?<h3>讓學(xué)習(xí)成為一種習(xí)慣</h3>
??? <div id="s_list">
?? ??? ?<ul id="content">
??????????? <li><a href="#">1.學(xué)會(huì)html5 絕對(duì)的屌絲逆襲(案例)</a><span>2013-09-18</span></li>
??????????? <li><a href="#">2.tab頁面切換效果(案例)</a><span>2013-10-09</span></li>
??????????? <li><a href="#">3.圓角水晶按鈕制作(案例)</a><span>2013-10-21</span></li>
??????????? <li><a href="#">4.HTML+CSS基礎(chǔ)課程(系列)</a><span>2013-11-01</span></li>
??????????? <li><a href="#">5.分頁頁碼制作(案例)</a><span>2013-11-06</span></li>
??????????? <li><a href="#">6.導(dǎo)航條菜單的制作(案例)</a><span>2013-11-08</span></li>
??????????? <li><a href="#">7.信息列表制作(案例)</a><span>2013-11-15</span></li>
??????????? <li><a href="#">8.下拉菜單制作(案例)</a><span>2013-11-22</span></li>
??????????? <li><a href="#">9.如何實(shí)現(xiàn)“新手引導(dǎo)”效果</a><span>2013-12-06</span></li>
??????? </ul>
??? </div>
</div>
<script>
var timer=null
var area=document.getElementById('s_list');
area.innerHTML=area.innerHTML+area.innerHTML;
function myUp(){
?? ?if(area.scrollTop>=area.offsetHeight){
?? ?area.scrollTop=0;
?? ?}
else{
?? ?area.scrollTop++;
?? ?}
}
timer=setInterval('myUp()',30);
area.onmouseover=function(){
?? ?clearInterval(timer);
?? ?}
area.onmouseout=function(){
?? ?timer=setInterval('myUp()',30);
?? ?}
</script>
</body>
</html>