网页图片无缝隙循环滚动功能代码实现
我想做一个网页图片无缝隙循环滚动,但我对这方面是门外的门外汉。在此请教各位高人,以下代码(为了实现网页图片无缝隙循环滚动)本人如何引用:1.代码粘贴在什么位置?2.如何修...
我想做一个网页图片无缝隙循环滚动,但我对这方面是门外的门外汉。在此请教各位高人,以下代码(为了实现网页图片无缝隙循环滚动)本人如何引用:
1.代码粘贴在什么位置?
2.如何修改代码?
备注:此代码本人试验了几次,但在ie浏览的时候,ie是一片空白。
如能qq联系在下,感激不尽。
谢谢。
<div id=Mydemo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
<table cellPadding=0 align=left border=0 cellspace="0">
<tr>
<td id=Mydemo1 vAlign=top><img src="../images/pic.gif"> <img src="../images/pic1.gif">
<img src="../images/pic2.gif">
<img src="../images/pic3.gif"> //这个图片的地址可以是相对的也可以是绝对的
</td>
<td id=Mydemo2 vAlign=top></td>
</tr>
</table>
</div>
<SCRIPT>
var speed=15 //设置移动的速度,越大越慢
Mydemo1.innerHTML=Mydemo2.innerHTML
function Marquee(){ //滚动函数
if(Mydemo1.offsetWidth-Mydemo.scrollLeft<=0) //判断是不是到了边界
Mydemo.scrollLeft-=Mydemo1.offsetWidth //如果到了边界,就从整个宽度中减去图片移动单元格的宽度,也就是参与滚动的所有图片宽度。
else{
Mydemo.scrollLeft++ //向左继续滚动,如果所有图片宽度小于整个<div>设定的宽度,那么判断条件总是真,那么就不会进入else部分,滚动也就会停止,我刚开始的问题就在这里,所以使用这个代码是一定要注意设定的<div>的宽度,也就是我代码中红色标出的部分,一定要比所有图片宽的和小!才能正常实现滚动。
}
}
var MyMar1=setInterval(Marquee,speed) //设定滚动速度
Mydemo.onmouseover=function() {clearInterval(MyMar1)} //设定鼠标移动到图片上面时停止
Mydemo.onmouseout=function() {MyMar1=setInterval(Marquee,speed)}//设定鼠标移开时继续滚动
</SCRIPT> 展开
1.代码粘贴在什么位置?
2.如何修改代码?
备注:此代码本人试验了几次,但在ie浏览的时候,ie是一片空白。
如能qq联系在下,感激不尽。
谢谢。
<div id=Mydemo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
<table cellPadding=0 align=left border=0 cellspace="0">
<tr>
<td id=Mydemo1 vAlign=top><img src="../images/pic.gif"> <img src="../images/pic1.gif">
<img src="../images/pic2.gif">
<img src="../images/pic3.gif"> //这个图片的地址可以是相对的也可以是绝对的
</td>
<td id=Mydemo2 vAlign=top></td>
</tr>
</table>
</div>
<SCRIPT>
var speed=15 //设置移动的速度,越大越慢
Mydemo1.innerHTML=Mydemo2.innerHTML
function Marquee(){ //滚动函数
if(Mydemo1.offsetWidth-Mydemo.scrollLeft<=0) //判断是不是到了边界
Mydemo.scrollLeft-=Mydemo1.offsetWidth //如果到了边界,就从整个宽度中减去图片移动单元格的宽度,也就是参与滚动的所有图片宽度。
else{
Mydemo.scrollLeft++ //向左继续滚动,如果所有图片宽度小于整个<div>设定的宽度,那么判断条件总是真,那么就不会进入else部分,滚动也就会停止,我刚开始的问题就在这里,所以使用这个代码是一定要注意设定的<div>的宽度,也就是我代码中红色标出的部分,一定要比所有图片宽的和小!才能正常实现滚动。
}
}
var MyMar1=setInterval(Marquee,speed) //设定滚动速度
Mydemo.onmouseover=function() {clearInterval(MyMar1)} //设定鼠标移动到图片上面时停止
Mydemo.onmouseout=function() {MyMar1=setInterval(Marquee,speed)}//设定鼠标移开时继续滚动
</SCRIPT> 展开
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询