Js圖片連續左右滾動代碼_圖片特效特效

發一個自己寫的JavaScript可控的圖片滾動，橫向左右滾動，可能還有些不完善的地方，也歡迎指正，鼠標放到控制按鈕上就可以控制圖片的滾動方向。

<title>Js圖片連續滾動代碼</title>
<IMG onMouseOver="moveThis('left')" style="CURSOR: pointer" onmouseout=moveout() height=30 
                  src="http://p1.mb5u.com/texiao/1/20110225160526422.gif" width=8>
<div   class="d7jbtjj"   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>
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	<img src="http://p1.mb5u.com/texiao/1/20110225160526423.jpg" class="floatleft" />
	</TABLE>
					  </TD>
                      <TD id=demo2></TD></TR></TABLE>
</DIV>
                
                <IMG onMouseOver="moveThis('right')" 
                  style="CURSOR: pointer" onmouseout=moveout() height=30 
                  src="http://p1.mb5u.com/texiao/1/20110225160526424.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>

所屬頻道：圖片特效特效/更新時間：2012-11-23

[收藏][報錯][返回列表]

相關圖片特效特效：

Js圖片連續左右滾動代碼_圖片特效特效

圖片特效特效Rss訂閱特效代碼搜索

圖片特效特效推薦

猜你也喜歡看這些