原理：其實就是通過滾動條的不停滾動來實現的效果（複製即用）
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<style type="text/css">
*{
padding:0;
margin:0;
border:none;
}
#news{
width:300px;
height:100px;
margin:20px auto;
background-color:#CCC;
border:#039 solid 1px;
overflow:hidden;/*這裏必須設置哦，否則滾動會消失的，如果設置爲scroll，更容易明白原理*/
}
#news li{
line-height:30px;
}
</style>
</head>
<body>
<div id="news" onmouseover="tz()" onmouseout="ks()">
<ul id="p1">
<li><a href="">1這是測試新聞滾動效果</a></li>
<li><a href="">2這是測試新聞滾動效果</a></li>
<li><a href="">3這是測試新聞滾動效果</a></li>
<li><a href="">4這是測試新聞滾動效果</a></li>
<li><a href="">5這是測試新聞滾動效果</a></li>
<li><a href="">6這是測試新聞滾動效果</a></li>
<li><a href="">7這是測試新聞滾動效果</a></li>
<li><a href="">8這是測試新聞滾動效果</a></li>
</ul>
<ul id="p2">
</ul>
</div>
<script type="text/javascript">
var n=document.getElementById("news");
var p1=document.getElementById("p1");
var p2=document.getElementById("p2");
p2.innerHTML=p1.innerHTML;
//alert(n.offsetHeight+" 1 "+p1.offsetHeight);
var f=function(){
n.scrollTop++;
if(n.scrollTop>=p1.offsetHeight){
//alert(n.scrollTop+" 1 "+p1.offsetHeight);
n.scrollTop=0;
}
}
var i=setInterval(f,20);
var tz=function(){
clearInterval(i);
}
var ks=function(){
i=setInterval(f,20);
}
</script>
</body>
</html>