<script type="text/javascript">
window.οnlοad=function(){//先声明变量
var oBox=document.getElementById('box');
var oImglist=document.getElementById('imglist');
var oImg=document.getElementsByTagName('li');
oImglist.innerHTML=oImglist.innerHTML+oImglist.innerHTML; //变成本身内容的两倍
oImglist.style.width=oImg[0].offsetWidth*oImg.length+'px';//把ul盒子的宽度也随着内容的大小而变大
timer=null;
function move(){
if(oImglist.offsetLeft>0){
oImglist.style.left=-oImglist.offsetWidth/2+'px';
//八张图片中最后一张图片距离div的左边大于0时,就把照片拉回原来的位置
}
oImglist.style.left=oImglist.offsetLeft+10+'px'; //向右移动10px;
}
oBox.οnmοuseοver=function(){ //当鼠标移入的是时候
clearInterval(timer);
}
oBox.οnmοuseοut=function(){ //当鼠标移出的时候
timer=setInterval(move,50);
}
timer=setInterval(move,50); //启动计数器,每隔50毫秒加载一次 move
}
</script>
<div id="box">
<ul id="imglist">
<li><img src="img/1.jpg"/></li>
<li><img src="img/2.jpg"/></li>
<li><img src="img/3.jpg"/></li>
<li><img src="img/4.jpg"/></li>
</ul>
</div>