可控制滚动方向的连续滚动图片,默认向左滚动
站内搜索：
专业术语
网站建设
网站推广
电子商务
网络营销
搜索引擎优化
可控制滚动方向的连续滚动图片,默认向左滚动
实现功能：默认向左自动滚动图片,用鼠标可以控制向左向右滚动,具体实现方法看如下代码：
以下是代码片段：
<a onMouseOver="r_left();">[向左]</a>
<div id="demo" style="float:left;overflow:hidden;width:810px;height:140px;margin-left:10px;">
<TABLE cellPadding="0" width="100%" align="left" border="0" cellSpacing="0">
<TR>
<!--------------------demo1--------------------->
<TD id="demo1" vAlign="top">
<TABLE cellSpacing="0" cellPadding="0">
<TR vAlign="top">
<TD vAlign="top" noWrap>
<TABLE cellSpacing="0" cellPadding="0" align="center" border="0">
<TR>
<TD align="middle">
<TABLE cellSpacing="0" cellPadding="0" width="140" align="center" border="0">
<TR><TD align="middle" height="120"><A href="product.html#p1" target="_parent"><img src="http://www.noonenet.cn/images/logo.gif" width="112" height="45" border="0"/></A></TD></TR>
<TR><TD align="middle" height="20"><A href="product.html#p1" target="_parent">图片一</A></TD></TR>
</TABLE>
</TD>
<TD align="middle">
<TABLE cellSpacing="0" cellPadding="0" width="140" align="center" border="0">
<TR><TD align="middle" height="120"><A href="product.html#p2" target="_parent"><img src="http://www.noonenet.cn/images/logo.gif" width="112" height="45" border="0"/></A></TD></TR>
<TR><TD align="middle" height="20"><A href="product.html#p2" target="_parent">图片二</A></TD></TR>
</TABLE>
</TD>
<TD align="middle">
<TABLE cellSpacing="0" cellPadding="0" width="140" align="center" border="0">
<TR><TD align="middle" height="120"><A href="product.html#p3" target="_parent"><img src="http://www.noonenet.cn/images/logo.gif" width="112" height="45" border="0"/></A></TD></TR>
<TR><TD align="middle" height="20"><A href="product.html#p3" target="_parent">图片三</A></TD></TR>
</TABLE>
</TD>
<TD align="middle">
<TABLE cellSpacing="0" cellPadding="0" width="140" align="center" border="0">
<TR><TD align="middle" height="120"><A href="product.html#p4" target="_parent"><img src="http://www.noonenet.cn/images/logo.gif" width="112" height="45" border="0"/></A></TD></TR>
<TR><TD align="middle" height="20"><A href="product.html#p4" target="_parent">图片四</A></TD></TR>
</TABLE>
</TD>
<TD align="middle">
<TABLE cellSpacing="0" cellPadding="0" width="140" align="center" border="0">
<TR><TD align="middle" height="120"><A href="product.html#p5" target="_parent"><img src="http://www.noonenet.cn/images/logo.gif" width="112" height="45" border="0"/></A></TD></TR>
<TR><TD align="middle" height="20"><A href="product.html#p5" target="_parent">图片五</A></TD></TR>
</TABLE>
</TD>
<TD align="middle">
<TABLE cellSpacing="0" cellPadding="0" width="140" align="center" border="0">
<TR><TD align="middle" height="120"><A href="product.html#p5" target="_parent"><img src="http://www.noonenet.cn/images/logo.gif" width="112" height="45" border="0"/></A></TD></TR>
<TR><TD align="middle" height="20"><A href="product.html#p5" target="_parent">图片六</A></TD></TR>
</TABLE>
</TD>
<TD align="middle">
<TABLE cellSpacing="0" cellPadding="0" width="140" align="center" border="0">
<TR><TD align="middle" height="120"><A href="product.html#p5" target="_parent"><img src="http://www.noonenet.cn/images/logo.gif" width="112" height="45" border="0"/></A></TD></TR>
<TR><TD align="middle" height="20"><A href="product.html#p5" target="_parent">图片七</A></TD></TR>
</TABLE>
</TD>
</TR></TABLE></TD></TR></TABLE></TD>
<!-------------------demo2--------------------->
<TD id=demo2 width="0"></TD>
</TR></TABLE>
<SCRIPT language="javascript">
<!--
var dir=1//每步移动像素，大＝快
var speed=1//循环周期（毫秒）大＝慢
document.getElementById("demo2").innerHTML = document.getElementById("demo1").innerHTML;
function Marquee(){//正常移动
if (dir>0 && (document.getElementById("demo2").offsetWidth-document.getElementById("demo").scrollLeft)<=0) document.getElementById("demo").scrollLeft=0
if (dir<0 &&(document.getElementById("demo").scrollLeft<=0)) document.getElementById("demo").scrollLeft=document.getElementById("demo2").offsetWidth
document.getElementById("demo").scrollLeft+=dir
document.getElementById("demo").onmouseover=function() {clearInterval(MyMar)}//暂停移动
document.getElementById("demo").onmouseout=function() {MyMar=setInterval(Marquee,speed)}//继续移动
}
function r_left(){if (dir=-1)dir=1}//换向左移
function r_right(){if (dir=1)dir=-1}//换向右移
var MyMar=setInterval(Marquee,speed)
//-->
</SCRIPT>
</div><a onMouseOver="r_right();">[向右]</a>
您的姓名：
公司名称：
联系电话：
电子邮箱：
留言内容：
上海幽微信息技术有限公司 沪ICP备08013669号
网络营销
|
营销网站建设
|
解决方案
|
网络推广
|
网站优化
|
搜索引擎优化
|
网络营销百科
|
友情链接
国内域名投诉电话 0592-2958888
