Question

制作网页中的滚动图片，怎样循环播放。

制作网页中的滚动图片，怎样循环播放。
我用的代码<div id="butong_net_left" style="overflow:hidden;width:500px;">

<table cellpadding="0" cellspacing="0" border="0">

<tr><td id="butong_net_left1" valign="top" align="center">

<table cellpadding="2" cellspacing="0" border="0">

<tr align="center">

<td><img src="<img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

</tr>

</table>

</td>

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

</tr>

</table>

</div>

<script>

var speed=30//速度数值越大速度越慢

butong_net_left2.innerHTML=butong_net_left1.innerHTML

function Marquee3(){

if(butong_net_left2.offsetWidth-butong_net_left.scrollLeft<=0)

butong_net_left.scrollLeft-=butong_net_left1.offsetWidth

else{

butong_net_left.scrollLeft++

}

}

var MyMar3=setInterval(Marquee3,speed)

butong_net_left.onmouseover=function() {clearInterval(MyMar3)}

butong_net_left.onmouseout=function() {MyMar3=setInterval(Marquee3,speed)}

</script>

能滚动但播完就停了，怎样才能自动循环呢？

Answer 1

1.打开Dreamweaver创建新页面，如图：

2.插入如下代码，如图：

<!--最新图文代码开始-->
<%
	set rs3=server.CreateObject("ADODB.RecordSet")
	rs3.Source ="select top " & top_img & " * from "& db_News_Table &" where picnews=1 and checkked=1 and picname<>'null' order by NewsID DESC"
	rs3.Open rs3.Source,conn,3,3
	if not rs3.EOF Then
%>
<div align='center' id='demo' style='overflow:hidden;height:125px;width:990px;'><!--滚动区的高度和宽度-->
<table align='center' cellpadding='0' cellspace='0' border='0'>
	<tr>
		<td id='demo1' valign='top'>
			<table width='100%' cellpadding='0' cellspacing='0' border='0' align='center'>
				<tr valign='top'>
					<%
						while not rs3.EOF
						fileExt=lcase(getFileExtName(rs3("picname")))
					%>
					<td align='center'>
						<TABLE width=100% border=0 align=center cellPadding=0 cellSpacing=0>
							<TR>
								<TD width=8 rowspan=3 >&nbsp;</TD>
								<TD vAlign=top width=8><img src='Images/bg_0ltop.gif' width=10 height=10></TD>
								<TD background=images/bg_01.gif></TD>
								<TD vAlign=top width=7><img src='Images/bg_0rtop.gif' width=10 height=10></TD>
								<TD width=7 rowspan=3 vAlign=top>&nbsp;</TD>
							</TR>
							<TR>
								<TD background='Images/bg_03.gif'>&nbsp;</TD>
								<TD align="center" bgcolor="#E9E9E9">			
									<%if fileext="jpg" or fileext="bmp" or fileext="png" or fileext="gif" then%>
									<table style="TABLE-LAYOUT: fixed" height=80 cellSpacing=0 cellPadding=0 width=105 border=0>
										<tr>
											<td style="HEIGHT: 80px">
												<a class=middle href='ReadNews.asp?NewsID=<%=rs3("NewsID")%>' target=_blank title='<%=rs3("title")%>'><img  src='<%=FileUploadPath & rs3("picname")%>' width='105' border=0></a>
											</td>
										</tr>
									</table>					
												<%else if fileext="swf" then%>
												<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'  codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0' width='105' height='80'>
													<param name=movie value='<%=FileUploadPath & rs3("picname")%>'>
													<param name=quality value=high>
													<param name='Play' value='-1'>
													<param name='Loop' value='0'>
													<param name='Menu' value='-1'>
													<param name='wmode' value='transparent'>
													<embed src='<%=FileUploadPath & rs3("picname")%>' width='105' height='80' pluginspage='http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash' type='application/x-shockwave-flash'></embed>
												</object>				
												<a class=middle href='ReadNews.asp?NewsID=<%=rs3("NewsID")%>' target=_blank title='<%=rs3("title")%>'></a>
												<%
												end if
												end If
												%>
								</TD>
								<TD background='Images/bg_04.gif'>&nbsp;</TD>
							</TR>
							<TR>
								<TD><img src='Images/bg_0lbottom.gif' width=10 height=10></TD>
								<TD><img src='Images/bg_02.gif'></TD>
								<TD><img src='Images/bg_0rbottom.gif' width=10 height=10></TD>
							</TR>
							<TR>
							<TD>&nbsp;</TD>
								<TD colspan=3 align=center height=20 valign='top' background='Images/bg_05.gif'>
								<a class=middle href='ReadNews.asp?NewsID=<%=rs3("NewsID")%>' target=_blank title='<%=rs3("title")%>'><%=CutStr(htmlencode4(rs3("title")),14)%></a>
								</TD>
								<TD>&nbsp;</TD>
							</TR>
						</TABLE>
					</td>
					<%
						rs3.MoveNext
						wend
					%>
				</tr>
			</table>
		</td>
		<td id=demo2 valign=top></td>
	</tr>
</table>
</div>
<%if top_img >4 then%>
<script>
	var speed=15
	demo2.innerHTML=demo1.innerHTML
	function Marquee1(){
	if(demo2.offsetWidth-demo.scrollLeft<=0)
	demo.scrollLeft-=demo1.offsetWidth
	else{
	demo.scrollLeft++
	}
	}
	var MyMar1=setInterval(Marquee1,speed)
	demo.onmouseover=function() {clearInterval(MyMar1)}
	demo.onmouseout=function() {MyMar1=setInterval(Marquee1,speed)}
</script>
<%
	end if
	else
	Response.Write "暂 无 最 新 图 文"
	end if
	rs3.close
	set rs3=nothing
%>
<!--最新图文代码结束-->

3.编写完成代码后查看预览效果图，如下：

注意事项:代码中select top " & top_img & " * from "& db_News_Table &" where picnews=1 and checkked=1 and picname<>'null' order by NewsID DESC"根据网站的数据库路径来定义数据表，包括ID编号的降序和顺序。

Answer 2

<MARQUEE scrollAmount=3 scrollDelay=1 direction=right width=990
<marquee onmouseover="this.stop();" onMouseOut="this.start();"
height=250><a href="网站"><IMG src="图片网址" width=180 border=0>
<a href="网站"><IMG src="图片网址" width=180 border=0>
<a href="网站"><IMG src="图片网址" width=180 border=0>
<a href="网站"><IMG src="图片网址" width=180 border=0>
<a href="网站"><IMG src="图片网址" width=180 border=0>
<a href="网站"><IMG src="图片网址" width=180 border=0>
<DIV></DIV></MARQUEE></CENTER>

我才学的 呵呵！ direction=right 滚动的方向 scrollAmount=3滚动的速度 鼠标在上面还要停的哦！ 其它的我也不知道了
呵呵！

你可以先到网站去看看都

Answer 3

参考一下下面这个代码，注意几个要点，滚动区域的宽度，所有图片总宽度，都会影响代码的滚动效果，可以参考资料中的网址下方的滚动效果
<div id="demo" style="OVERFLOW: hidden; height:128px;width:460px;color:#ffffff">
<div id="maque">
<nobr><div id="demo1">

<div>
<table cellpadding="0" cellspacing="0" border="0">

<tr><td id="butong_net_left1" valign="top" align="center">

<table cellpadding="2" cellspacing="0" border="0">

<tr align="center">

<td><img src="<img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

<td><img src="插入需要滚动的图片"></td>

</tr>

</table>

</td>

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

</tr>

</table>
</div>

</div><div id="demo2"></div></nobr></div>
<script type="text/javascript">
var speed=60
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
</script>
</div>

Answer 4

这里有一个无缝滚动效果
你可以参考一下