您的位置:首页 > Web前端 > JavaScript

Js图片连续左右滚动

2016-07-11 11:11 519 查看
<title>Js图片连续滚动代码</title>

<IMG onMouseOver="moveThis('left')" style="CURSOR: pointer" onmouseout=moveout() height=30

src="6637716.gif" width=8>

<DIV id=demo style="OVERFLOW: hidden; WIDTH: 255px; HEIGHT: 78px">

<TABLE cellSpacing=0 cellPadding=0 border=0>

<TR>

<TD id=demo1>

<TABLE id=demo3 style="MARGIN-LEFT: 0px" cellSpacing=0

cellPadding=0 width=459 border=0 height=300px border=1>

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

<img src="wall_s8.jpg" class="floatleft" />

</TABLE>

</TD>

<TD id=demo2></TD></TR></TABLE>

</DIV>

<IMG onMouseOver="moveThis('right')"

style="CURSOR: pointer" onmouseout=moveout() height=30

src="6637743.gif" width=8>

<SCRIPT language=javascript>

var speed=30;

demo2.innerHTML=demo1.innerHTML;

function MarqueeL(){

if(demo2.offsetWidth-demo.scrollLeft<=0)

demo.scrollLeft-=demo1.offsetWidth;

else

demo.scrollLeft++;

}

function MarqueeR(){

if(demo2.offsetWidth-demo.scrollLeft>=255)

demo.scrollLeft+=demo1.offsetWidth;

else

demo.scrollLeft--;

}

var flag=0;

var MyMar;

//var MyMar=setInterval(MarqueeL,speed);

demo.onmouseover=function() {if(MyMar){clearInterval(MyMar)}}

//demo.onmouseout=function() {MyMar=setInterval(MarqueeR,speed)}

function moveout(way)

{

if(MyMar)

{

clearInterval(MyMar);

}

}

function moveThis(way){

if(way=='right'){

flag=1;

if(MyMar)

{

clearInterval(MyMar);

}

MyMar=setInterval(MarqueeR,speed);

}

else{

flag=0;

if(MyMar)

{

clearInterval(MyMar);

}

MyMar=setInterval(MarqueeL,speed);

}

if(flag) demo.onmouseout=function() {MyMar=setInterval(MarqueeR,speed)}

else demo.onmouseout=function() {MyMar=setInterval(MarqueeL,speed)}

}

</SCRIPT>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: