Js图片连续左右滚动代码_图片特效特效

缁囨ⅵDedeCMS瑙嗛鏁欑▼涔扮┖闂� 绉熸湇鍔″櫒閫夌綉纭曚簰鑱旓紒 鏃犲咖绔欓暱宸ュ叿,鐧惧害鏉冮噸涓€閿叏鏌�!

发一个自己写的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 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订阅特效代码搜索

图片特效特效推荐

猜你也喜欢看这些

鏀惰棌&鍒嗕韩