图片分辨率为 310*465
用到了 setinterval 定时器实现
<body>
<div id="container">
<div id="main">
<ul id="m-list">
<li><a href="#"><img src="images/01.jpg"/></a></li>
<li><a href="#"><img src="images/02.jpg"/></a></li>
<li><a href="#"><img src="images/03.jpg"/></a></li>
<li><a href="#"><img src="images/04.jpg"/></a></li>
<li><a href="#"><img src="images/05.jpg"/></a></li>
<li><a href="#"><img src="images/06.jpg"/></a></li>
</ul>
</div>
</div>
<script>
window.οnlοad=function(){
var iList=document.getElementById('m-list');
var iMain=document.getElementById('main');
var intervalIndex=0;
var initialLeft=0;
function moveBg(){
iList.style.left=initialLeft+'px';
initialLeft--;
if(initialLeft==-1240){initialLeft=0;}
}
intervalIndex=setInterval(moveBg,10);
iMain.οnmοuseοver=function(){
clearInterval(intervalIndex);
console.log('mouseover'+intervalIndex);
}
iMain.οnmοuseοut=function(){
clearInterval(intervalIndex);
intervalIndex=setInterval(moveBg,10);
console.log('mouseout'+intervalIndex);
}
}
</script>
</body>
