各位高手帮我分析一下图片向上滚动的代码!

Aking5018 2004-06-23 10:57:35

最近做宣传页是一个图片向上滚动的程序。
需要五张图片同时向上滚动.然后滚动一次停顿数秒。然后在继续滚动。
其中鼠标悬停在图片上时，图片停止滚动.
我找了一个代码，上诉功能都可以实现。但是缺点就是只能显示一张图片。
哪位高手帮我修改一下，可以让五张图片并排向上滚动.(不想套桢)
程序代码:
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>Test</TITLE>
<SCRIPT language=javascript>
var scrollerheight=400; //滚动总体高度
var html,total_area=0,wait_flag=true;
var bMouseOver = 1;
var scrollspeed = 1;
var waitingtime = 3000; //每次停顿时间
var s_tmp = 0, s_amount = 200; //每次滚动的高度
var scroll_content=new Array();
var startPanel=0, n_panel=0, i=0;

function startscroll()
{
i=0;
for (i in scroll_content)
n_panel++;

n_panel = n_panel -1 ;
startPanel = Math.round(Math.random()*n_panel);
if(startPanel == 0)
{
i=0;
for (i in scroll_content)
insert_area(total_area, total_area++);
}
else if(startPanel == n_panel)
{
insert_area(startPanel, total_area);
total_area++;
for (i=0; i<startPanel; i++)
{
insert_area(i, total_area);
total_area++;
}
}
else if((startPanel > 0) || (startPanel < n_panel))
{
insert_area(startPanel, total_area);
total_area++;
for (i=startPanel+1; i<=n_panel; i++)
{
insert_area(i, total_area);
total_area++;
}
for (i=0; i<startPanel; i++)
{
insert_area(i, total_area);
total_area++;
}
}
window.setTimeout("scrolling()",waitingtime);
}
function scrolling(){
if (bMouseOver && wait_flag)
{
for (i=0;i<total_area;i++){
tmp = document.getElementById('scroll_area'+i).style;
tmp.top = parseInt(tmp.top)-scrollspeed;
if (parseInt(tmp.top) <= -scrollerheight){
tmp.top = scrollerheight*(total_area-1);
}
if (s_tmp++ > (s_amount-1)*scroll_content.length){
wait_flag=false;
window.setTimeout("wait_flag=true;s_tmp=0;",waitingtime);
}
}
}
window.setTimeout("scrolling()",1);
}
function insert_area(idx, n){
html='<div style="left: 0px; position: absolute; top: '+(scrollerheight*n)+'px" id="scroll_area'+n+'">\n';
html+=scroll_content[idx]+'\n';
html+='</div>\n';
document.write(html);
}
var newsVar = 0;
scroll_content[0]="<img src='images/1.jpg' Style='height:200;width:200' Style='Cursor:hand'><img src='images/2.jpg' Style='height:200;width:200' Style='Cursor:hand'>ccc<br>";
scroll_content[1]="<img src='images/3.jpg' Style='height:200;width:200' Style='Cursor:hand'><img src='images/4.jpg' Style='height:200;width:200' Style='Cursor:hand'>ddd<br>";
</SCRIPT>
</HEAD>
<BODY>
<DIV id=scroll_image onmouseover=bMouseOver=0 style="OVERFLOW: hidden; WIDTH: 200px; POSITION: absolute; HEIGHT: 174px; left:4px; top:1px" onmouseout=bMouseOver=1 border=1>
<table border=1>
<tr>
<td><SCRIPT>startscroll();</SCRIPT></td>
</tr>
</table>
</DIV>
</BODY></HTML>

...全文