淘宝店铺装修
分享淘宝滚动图片的代码
2024-02-25  浏览:23

淘宝店铺的推广中,如何让你的图片会说话?淘宝学堂和你来一起做淘宝滚动图片的代码。

<!------------------ 向左滚动代码开始 -------------------------->

<div id=demo style="overflow:scroll;height:93;width:600;background:#214984;color:#ffffff" >

<table align=left cellpadding=0 cellspacing=0 border=0>

<tr>

<td id=demo1 valign=top><img src="1-1.jpg" width="102" height="77" border="0" /><img src="2-1.jpg" width="102" height="77" border="0" /><img src="3-1.jpg" width="102" height="77"border="0" /><img src="4-1.jpg" width="102" height="77"border="0" /><img src="5-1.jpg" width="102" height="77"border="0" /><img src="6-1.jpg" width="102" height="77"border="0" /></td>

<td id=demo2 valign=top"></td>

</tr>

</table>

</div>

<script type="text/javascript">

var speed=30 //速度(单位:毫秒,1秒=1000毫秒)

demo2.innerHTML=demo1.innerHTML //将第二个储存格的空内容使用和第一格一样的内容填充

function Marquee(){

if(demo1.offsetWidth-demo.scrollLeft<=0) //假如图片走到第一个储存格完

demo.scrollLeft-=demo2.offsetWidth // 这时候重新从第一格第一张图片开始走动

else{ //否则

demo.scrollLeft++ // 滚动条一直向左滚动

}

}

var MyMar=setInterval(Marquee,speed) //以时间speed为间隔逐次调用滚动条函数

demo.onmouseover=function() {clearInterval(MyMar)} //鼠标放上的时候解除对滚动函数的调用

demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//移开则重新调用滚动函数

</script>

<!------------------ 向右滚动代码开始 -------------------------->

<div id=demoRight style="overflow:hidden;height:77;width:600;background:#000000;color:#ffffff;border:5px none #000000;">

<table align=left cellpadding=0 cellspacing=0 border=0>

<tr>

<td id=demoRight1 valign=top><img src="1-1.jpg" width="102" height="77" border="0" /><img src="2-1.jpg" width="102" height="77" border="0" /><img src="3-1.jpg" width="102" height="77"border="0" /><img src="4-1.jpg" width="102" height="77"border="0" /><img src="5-1.jpg" width="102" height="77"border="0" /><img src="6-1.jpg" width="102" height="77"border="0" /><img src="7-1.jpg" width="102" height="77"border="0" /><img src="8-1.jpg" width="102" height="77" border="0" /></td>

<td id=demoRight2 valign=top></td>

</tr>

</table>

</div>

<script type="text/javascript">

var speed_Right=30

demoRight2.innerHTML=demoRight1.innerHTML

demoRight.scrollLeft = demoRight1.offsetWidth

function Marquee_Right(){

if(demoRight.scrollLeft<=0)

demoRight.scrollLeft+=demoRight1.offsetWidth

else{

demoRight.scrollLeft--

}

}

var MyMar_Right=setInterval(Marquee_Right,speed_Right)

demoRight.onmouseover=function(){clearInterval(MyMar_Right)}

demoRight.onmouseout=function() {MyMar_Right=setInterval(Marquee_Right,speed_Right)}

</script>

发表评论
0评