JS的无缝滚动

来源:互联网 发布:淘宝怎么出售游戏账号 编辑:程序博客网 时间:2024/05/02 02:43
<!DOCTYPE html><html><head><meta charset="utf-8"/><title>arguments</title><meta name="keyword" content=""/><meta name="description" content=""/><meta name="viewport" content="width=device-width"/><style type="text/css">*{margin: 0;padding: 0}#div1 {width:712px;height:108px;background-color: red;position: relative;margin: 200px auto;overflow: hidden;}#div1 ul {position: absolute;left:0;}#div1 ul li {float: left;width:178px;height: 108px;list-style: none;}</style></head><body><div id="div1"><ul id="ul1"><li><img src="../../picture/img2/1.jpg"></li><li><img src="../../picture/img2/2.jpg"></li><li><img src="../../picture/img2/3.jpg"></li><li><img src="../../picture/img2/4.jpg"></li></ul></div><script type="text/javascript">/*var div=document.getElementById('div1');timer= setInterval(function () { odiv.style.left=odiv.offsetLeft+10+'px'; odiv.style.top=odiv.offsetTop+10+'px';if(parseInt(odiv.style.top)>=900||parseInt(odiv.style.left)>=900){clearInterval(timer)}},30);*/var odiv=document.getElementById('div1');var oul=document.getElementById('ul1');var ali=oul.getElementsByTagName('li');oul.innerHTML=oul.innerHTML+oul.innerHTML;   oul.style.width=ali[0].offsetWidth*ali.length+'px';setInterval(function(){ if(oul.offsetLeft<-oul.offsetWidth/2){oul.style.left='0'}oul.style.left=oul.offsetLeft-2+'px';        //if(oul.offsetLeft>-oul.offerstwidth/2)},10)</script></body></html>

原创粉丝点击