如何在同一个页面设置4个滚动？

我按照网上的代码，设置了一个滚动，但是在同一个页面如何设置4个滚动，我测试了好几次，代码总是冲突，只能实现一个滚动，请问具体代码该如何修改？
代码如下：<!--#include file="Conn3.asp"--><html>
<head>
<title>管理中心</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<LINK href="../Image/style.css" type=text/css rel=stylesheet>
<script language="JavaScript" src="../Image/js.js"></SCRIPT><style type="text/css">
<!--
.STYLE1 {
color: #FF0000;
font-size: x-large;
font-weight: bold;
}
.STYLE2 {color: #FFFFFF}
.STYLE3 {
color: #FF0000;
font-weight: bold;
}
body {
background-color: #ced7f7;
margin-top: 2px;
}
.STYLE4 {color: #999999}
.STYLE6 {color: #FDFDC6}
A:hover {
COLOR: #FFFFFF;
}
-->
</style>
</head>
<body text="#000000">
<table width="780" height="454" border="0" align="center" cellpadding="0" cellspacing="5" bordercolor="#CCCCCC" bgcolor="#ced7f7">
  <tr >
    <td height="34" colspan="2" ><table width="100%" border="1" align="center" cellpadding="0">
      <tr>
        <td height="66" align="center" bgcolor="#0033CC"><span class="STYLE1">儋州琼富塑料有限公司管理系统</span></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td width="390" height="200" align="center" valign="top" bordercolor="#CCCCCC">


<table width="100%" border="1" align="center" cellpadding="0" cellspacing="0">
<%set rs=server.CreateObject("adodb.recordset")

sql="select top 8 * from cangku where (shuliang<=baojing) "
 rs.open sql&" order by (baojing*danjia) desc",conn,1,1 %>

      <tr>
        <td height="25" background="info/docc/images/search_1.gif"><span class="STYLE2">&nbsp;库存预警</span></td>
      </tr>
 
         <tr>
           <td height="25" align="center">
 
    <DIV id=marqueey >
    <%
   do while not rs.eof%>

   <table width="100%" border="0" cellpadding="0" cellspacing="0">
             

             <tr>
               <td width="39%" height="25" align="left">&nbsp;&nbsp;<%=rs("chanpinname")%></td>
               <td width="23%" height="25" align="left"><%=rs("guige")%></td>
               <td width="19%" height="25" align="left"><%=rs("danwei")%></td>
               <td width="19%" height="25" align="left"><%=rs("shuliang")%></td>
             </tr>
        
 
           </table>  
   
                        <%
rs.movenext
loop
rs.close
set rs=nothing%>

   </DIV>
   </td>
         </tr>
  

    </table>


</td>
    <td width="390" height="200" align="center" valign="top" bordercolor="#CCCCCC">

<table width="98%" height="100%" border="1" align="center" cellpadding="0" cellspacing="0">
  
  <tr>
    <td height="25" background="info/docc/images/search_1.gif">&nbsp;<a href="#" onClick="javascript:window.open('show_gonggao.asp','','scrollbars=yes,resizable=no,width=600,height=700,top=0,left=300')"> <span class="STYLE2">公告消息</span></a></td>
  </tr>
  <tr>
    <td width="0" align="left" valign="top">

<%set rs=server.CreateObject("adodb.recordset")

sql="select * from gonggao  "
 rs.open sql&" order by ptime desc,addtime desc",conn,1,1 %>

   
     <DIV id=marqueey1 >
   <table width="100%" height="180" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td>&nbsp;</td>
  </tr>
</table> <% do while not rs.eof%>

    <table width="100%" height="25" border="0" cellpadding="0">

      
      <tr onMouseOver="mouseOver(this,'#728CE9');"   onmouseout="mouseOut(this,'#ced7f7');">
        <td width="65%" height="25" align="left" valign="middle" >&nbsp;<a href="#" onClick="javascript:window.open('show_gonggao.asp?id=<%=rs("id")%>','','scrollbars=yes,resizable=no,width=600,height=600,top=100,left=400')"> <%=left(rs("biaoti"),16)%></a></td>
        <td width="35%" height="25" align="left" valign="middle" class="STYLE2"><%=rs("addtime")%></td>
      </tr>
      
    </table> <%
rs.movenext
loop
rs.close
set rs=nothing%>
</DIV>
</td>


  </tr>
</table>

</td>
  </tr>
  <tr>
    <td width="390" height="200" valign="top" bordercolor="#CCCCCC"><table width="100%" border="0" cellpadding="0" cellspacing="2">
      <tr>
        <td></td>
      </tr>
    </table>
    <table width="98%" height="95%" border="1" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td height="25" background="info/docc/images/search_1.gif"><span class="STYLE2">&nbsp;订单提醒</span></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table></td>
    <td width="390" height="200" valign="top" bordercolor="#CCCCCC">


<table width="100%" border="0" cellpadding="0" cellspacing="2">
      <tr>
        <td></td>
      </tr>
    </table>



<table width="98%" height="95%" border="1" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td height="25" background="info/docc/images/search_1.gif"><span class="STYLE2">&nbsp;规章制度</span></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
    </table></td>
  </tr>
</table><TABLE class=tableBorder cellSpacing=0 cellPadding=0 width="98%" align=center 
border=0>
  <TBODY>
    <TR> 
      <TH class=tableHeaderText colSpan=2 height=22>常 用 工 具</TH>
    <TR>     <TR> 
      <TD class=forumRow width="50%" 
      height=23>&nbsp;&nbsp;<a href="tools/rl/cal.htm">万年日历</a></TD>
      <TD class=forumRow width="50%"><a href="tools/rl/time.htm">&nbsp;&nbsp;世界时间</a></TD>
    </TR>
    <TR> 
      <TD class=forumRow width="50%" 
      height=23>&nbsp;&nbsp;<a href="tools/yzqh/default.asp">邮政编码</a></TD>
      <TD class=forumRow width="50%">&nbsp;&nbsp;<a href="tools/shouji/index.asp">手机网络</a></TD>
    </TR>
    <TR>     
      <TD class=forumRow width="50%" 
      height=23>&nbsp;&nbsp;<a href="#" onclick ="javascript:openwinfun('tools/rl/js1.html','qymlwin',400,550);">在线计算器</a></TD>
    </TR>
    <TR>        </TBODY>
</TABLE><p>
<p>
<TABLE align=center>
  <TBODY>
  <TR>
    <TD><p align="center"><BR>
      Copyright (c) 2010&nbsp;<span class="STYLE3"><font size="1" face="Verdana,"> qiongfu</font></span> All Rights 
      Reserved .</p>
      <p align="center">版权所有：儋州琼富塑料有限公司<BR>
          <BR>
          <BR>
        </p></TD></TR></TBODY></TABLE>


<SCRIPT language=JavaScript>
marqueeyHeight=220;    //载体高度控制
stopscroll=false;
with(marqueey1){
    style.width=350;
    style.height=marqueeyHeight;
    style.overflowX="visible";
    style.overflowY="hidden";
    noWrap=true;
    onmouseover=new Function("stopscroll=true");
    onmouseout=new Function("stopscroll=false");
}
document.write('<div id="templayer1" style="position:absolute;z-index:1;visibility:hidden"></div>');
preTop=0; currentTop=0;
function init1(){
    templayer1.innerHTML="";
    while(templayer1.offsetHeight<marqueeyHeight){
        templayer1.innerHTML+=marqueey1.innerHTML;
    }
    marqueey1.innerHTML=templayer1.innerHTML+templayer1.innerHTML;
    setInterval("scrollUp1()",40);    //滚动速度控制,越大越慢
}
document.body.onload=init1;
function scrollUp1(){
    if(stopscroll==true) return;
    preTop=marqueey1.scrollTop;
    marqueey1.scrollTop+=1;
    if(preTop==marqueey1.scrollTop){
        marqueey1.scrollTop=templayer1.offsetHeight-marqueeyHeight;
        marqueey1.scrollTop+=1;
    }
}
</SCRIPT>

</bady></html>

解决方案 »

  1.   

    谢谢~！我这里正是用 div  但是我不知道该怎么 同时让四个 div 同时在一个页面滚动。有会的麻烦指点一下。
      

  2.   

    控制滚动的js重写成4个，
    把里面的变量类似于document.write()这些东西写死的id啥的变化下，
    就OK，
    最简单但也是最笨，最有效的办法
      

  3.   

    非常感谢以上几位同志的帮忙~！！！
    还是不行，中心代码 就下面这一段，
    无论你如何修改，改成两个代码 片段，
    总是最后一段代码起作用，
    例如
    <SCRIPT language=JavaScript>
    marqueeyHeight=220;    //载体高度控制
    stopscroll=false;
    with(marqueey1){
        style.width=350;
        style.height=marqueeyHeight;
        style.overflowX="visible";
        style.overflowY="hidden";
        noWrap=true;
        onmouseover=new Function("stopscroll=true");
        onmouseout=new Function("stopscroll=false");
    }
    document.write('<div id="templayer1" style="position:absolute;z-index:1;visibility:hidden"></div>');
    preTop=0; currentTop=0;
    function init1(){
        templayer1.innerHTML="";
        while(templayer1.offsetHeight<marqueeyHeight){
            templayer1.innerHTML+=marqueey1.innerHTML;
        }
        marqueey1.innerHTML=templayer1.innerHTML+templayer1.innerHTML;
        setInterval("scrollUp1()",40);    //滚动速度控制,越大越慢
    }
    document.body.onload=init1;
    function scrollUp1(){
        if(stopscroll==true) return;
        preTop=marqueey1.scrollTop;
        marqueey1.scrollTop+=1;
        if(preTop==marqueey1.scrollTop){
            marqueey1.scrollTop=templayer1.offsetHeight-marqueeyHeight;
            marqueey1.scrollTop+=1;
        }
    }
    </SCRIPT>



    <SCRIPT language=JavaScript>
    marqueeyHeight=220;    //载体高度控制
    stopscroll=false;
    with(marqueey2){
        style.width=350;
        style.height=marqueeyHeight;
        style.overflowX="visible";
        style.overflowY="hidden";
        noWrap=true;
        onmouseover=new Function("stopscroll=true");
        onmouseout=new Function("stopscroll=false");
    }
    document.write('<div id="templayer2" style="position:absolute;z-index:1;visibility:hidden"></div>');
    preTop=0; currentTop=0;
    function init2(){
        templayer2.innerHTML="";
        while(templayer2.offsetHeight<marqueeyHeight){
            templayer2.innerHTML+=marqueey2.innerHTML;
        }
        marqueey2.innerHTML=templayer2.innerHTML+templayer2.innerHTML;
        setInterval("scrollUp2()",40);    //滚动速度控制,越大越慢
    }
    document.body.onload=init2;
    function scrollUp2(){
        if(stopscroll==true) return;
        preTop=marqueey2.scrollTop;
        marqueey2.scrollTop+=1;
        if(preTop==marqueey2.scrollTop){
            marqueey2.scrollTop=templayer2.offsetHeight-marqueeyHeight;
            marqueey2.scrollTop+=1;
        }
    }
    </SCRIPT>就算改成以上的样子， 总是最后一个 JavaScript 代码片段在起作用。（第一段就不会滚动了，代码没有错，你把他两换一下位置，总是最后一段在其作用，）
    如何解决？