图片跑马灯可控制停止,开始(调试通过)-优快云博客

本文链接：https://blog.youkuaiyun.com/ITFLY8/article/details/633221

本文提供了一段使用JavaScript实现的滚动图片展示脚本代码。该脚本能够在网页上创建两个并排滚动显示的图片区域，每个区域展示从数据库中获取的最新六条记录对应的图片。当鼠标悬停在图片上时，滚动会暂停，提高用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

此代码在他人文章修改完成
<HTML><HEAD>
<TITLE></TITLE>
<META http-equiv=Content-Type content=text/html; charset=gb2312>
<SCRIPT language=JavaScript>
<!--
var ver = 3
bVer = parseInt(navigator.appVersion);
if(bVer >= 4) ver = 4
var ns = navigator.appName == "Netscape";
var ie = navigator.appName == "MSIE";
//////////// ticker variables ////////////////////////////////////////
var pix = 2;           // number of pixels to move per frame
var rate = 250;         // frames per second
var ImgWidth = 640;   // width of ticker image
/////////////////////////////////////////////////////////////////////
var time = 1000/rate;
var again = - ImgWidth
function tick() {
if (ver ==3) return
if (ns){
        document.Layer1.offset(-pix,0);
        document.Layer2.offset(-pix,0);
        if (document.Layer1.left <= again) document.Layer1.left = ImgWidth;
       if (document.Layer2.left <= again) document.Layer2.left = ImgWidth;
        }
else {
        newpix = document.all["Layer1"].style.pixelLeft - pix;
        newpix2 = document.all["Layer2"].style.pixelLeft - pix;
        document.all["Layer1"].style.pixelLeft = newpix;
        document.all["Layer2"].style.pixelLeft = newpix2;
        if (document.all["Layer1"].style.pixelLeft <= again) document.all

["Layer1"].style.pixelLeft = ImgWidth;

if (document.all["Layer2"].style.pixelLeft <= again) document.all

["Layer2"].style.pixelLeft = ImgWidth;
}

setTimeout('tick()', time);
}
function divStop(){
clearTimeout();
ver=3;
setTimeout('tick()', time);
}
function divStart(){
clearTimeout();
ver=2;
setTimeout('tick()', time);
}
//-->
</SCRIPT>
<META content="MSHTML 6.00.640.1106" name=GENERATOR>
<script language="JavaScript" type="text/JavaScript">

</script>
<link href="css2.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</HEAD>
<BODY onload=tick(1) marginleft="0" marginright="0" bgcolor="#FFFFFF">
<DIV align=left>
<form action="" method="post" name="divForm">
<input name="divStop" type="hidden" value="">
</form>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td valign="top">                      <SPAN id=Layer1
style="Z-INDEX: 2; LEFT: 0px; WIDTH: 640px; POSITION: absolute; TOP: 2px; HEIGHT: 107px">

            <% set rs=server.createobject("adodb.recordset")
     sql="select top 6 * from sdjg_table order by ordertime desc"
     rs.open sql,conn,1,1
%>
      <%
if rs.bof or rs.eof then
response.write"<font color=red>No Pic！</font>"
'response.end
else
%>
                      <%
if rs.eof then
response.Write("No Pic！")
response.End()
end if%>
                      <table width="100%" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                          <% c=0
          d=0
            do while not rs.eof%>
                          <td><div align="center">
                            <table width="100" height="100" border="0" align="center"

cellpadding="2" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<td bgcolor="#FFFFFF"><a href="sdjgshow.asp?showid=<%=rs

("id")%>" target="_blank"><img src="admin/upImg/<%=rs("smallimg")%>"

onMouseOver="javascript:divStop();" onMouseOut="javascript:divStart();" width="94" height="94"

border="0" /></a></td>
                              </tr>
                            </table>
                            <a href="M_ViewImage.asp?ProductID=<%=rs("id")%>" target="_blank">

</a></div></td>
                          <% c=c+1%>
                          <% if c>6 then%>
                        </tr>
                        <tr>
                          <% c=0 %>
                          <% end if%>
                          <%d=d+1%>
                          <% if not rs.eof then%>
                          <% rs.movenext%>
                          <% else
           exit do
          end if%>
                          <%loop%>
                      </table><% End If %></span>
                      <SPAN id=Layer2
style="Z-INDEX: 2; LEFT: 640px; WIDTH: 640px; POSITION: absolute; TOP: 2px; HEIGHT: 107px">
            <% set rs=server.createobject("adodb.recordset")
     sql="select top 6 * from sdjg_table order by ordertime desc"
     rs.open sql,conn,1,1
%>
      <%
if rs.bof or rs.eof then
response.write"<font color=red>No pic！</font>"
'response.end
else
%>
                      <%
if rs.eof then
response.Write("No pic！")
response.End()
end if%>
                      <table width="100%" border="0" cellspacing="0" cellpadding="0">
                        <tr>
                          <% c=0
          d=0
            do while not rs.eof%>
                          <td><div align="center"><a href="M_ViewImage.asp?ProductID=<%=rs

("id")%>" target="_blank"> </a>
<table width="100" border="0" align="center" cellpadding="2"

cellspacing="1" bgcolor="#FFFFFF">
<tr>
<td bgcolor="#E9E9E9"><a href="sdjgshow.asp?showid=<%=rs

("id")%>" target="_blank"><img src="admin/upImg/<%=rs("smallimg")%>"

onMouseOver="javascript:divStop();" onMouseOut="javascript:divStart();" width="94" height="94"

border="0" /></a></td>
                              </tr>
                            </table>
                          </div></td>
                          <% c=c+1%>
                          <% if c>6 then%>
                        </tr>
                        <tr>
                          <% c=0 %>
                          <% end if%>
                          <%d=d+1%>
                          <% if not rs.eof then%>
                          <% rs.movenext%>
                          <% else
           exit do
          end if%>
                          <%loop%>

                    </table><% End If %> </SPAN>                    </td>
                  </tr>
                </table>
</DIV>
</BODY></HTML>