请教高手,怎么实现动态图片滚动
本人在做一个产品模块,要求是所有的产品图片都在一行里实现不间断左右滚动,做了很长时间了,一直实现不了,请高手们帮我解决下了!!!!!!!!!!!!
程序代码:
<HTML> <HEAD> <TITLE> New Document </TITLE> </HEAD> <BODY> <div id="marquees"> <a href="#"><img src="1.jpg" width="117" height="42" alt="1"/></a> <a href="#"><img src="2.jpg" width="117" height="42" alt="2"/></a> <a href="#"><img src="3.jpg" width="117" height="42" alt="3"/></a> <a href="#"><img src="4.jpg" width="123" height="42" alt="4"/></a> </div> <script language="JavaScript"> marqueesWidth=400; stopscroll=false; with(marquees){ style.width=marqueesWidth; style.height=0; style.overflowX="hidden"; style.overflowY="visible"; noWrap=true; onmouseover=new Function("stopscroll=true"); onmouseout=new Function("stopscroll=false"); } document.write('<div id="templayer" style="position:absolute;z- index:1;visibility:hidden"></div>'); preTop=0; currentTop=0; function init(){ templayer.innerHTML=""; while(templayer.offsetWidth<marqueesWidth){ templayer.innerHTML+=marquees.innerHTML; } marquees.innerHTML=templayer.innerHTML+templayer.innerHTML; setInterval("scrollLeft()",50); } document.body.onload=init; function scrollLeft(){ if(stopscroll==true) return; preTop=marquees.scrollLeft; marquees.scrollLeft+=1; if(preTop==marquees.scrollLeft){ marquees.scrollLeft=templayer.offsetWidth-marqueesWidth; marquees.scrollLeft+=1; } } </script> </BODY> </HTML>