我是javascript的新手,必须维护一个旧的应用程序。我想知道是否有一种方法可以让这个滚动条一次显示多条消息。 感谢。
<table cellpadding="0" cellspacing="0" border="1" bordercolor="#EAFFFF">
<tr>
<td align="center" background="http://www.cosco-usa.com/images/td_bg.gif " style="width: 21%">
<a href="http://www.coscoamericas.com/channels/176.html" title="More News" target="_blank">
<img src="http://www.cosco-usa.com/images/newspaper.ico" align="absmiddle" alt="" border="0"></a>
<img src="http://www.cosco-usa.com/images/px1.gif" width="6" height="1" alt="" border="0"> <a href="http://www.coscoamericas.com/channels/176.html" title="More News" target="_blank">
<font face="Arial,Helvetica,Geneva,Swiss,SunSans-Regular" size="2"><b>LATEST NEWS</b></font></a>
<img src="http://www.cosco-usa.com/images/px1.gif" width="20" height="1" alt="" border="0">
</td>
</tr>
</table>
&#13;
有一个包含所有消息的数组消息[]。
var scrollerdelay='3000' //delay between msg scrolls. 3000=3 seconds.
var scrollerwidth='220px'
var scrollerheight='60px'
var scrollerbgcolor='E6E6E6'
//set below to '' if you don't wish to use a background image
var scrollerbackground='paper1.jpg'
//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<font face='Verdana' size='-1' color='teal'><a href='http://www.coscoamericas.com/contents/176/538.html'>Message 1!</a></font>"
messages[1]="<font face='Verdana' size='-1' color='teal'><a href='http://www.coscoamericas.com/contents/176/538.html'>Message 2!</a></font>"
messages[2]="<font face='Verdana' size='-1' color='teal'><a href='http://www.coscoamericas.com/contents/176/538.html'>Message 3!</a></font>"
messages[3]="<font face='Verdana' size='-1' color='teal'><a href='http://www.coscoamericas.com/contents/176/538.html'>Message 4!</a></font>"
messages[4]="<font face='Verdana' size='-1' color='teal'><a href='http://www.coscoamericas.com/contents/176/538.html'>Message 5!</a></font>"
&#13;
JavaScript -
var ie = document.all
var dom = document.getElementById
if (messages.length > 2)
i = 2
else
i = 0
function move1(whichlayer) {
tlayer = eval(whichlayer)
if (tlayer.top > 0 && tlayer.top <= 5) {
tlayer.top = 0
setTimeout("move1(tlayer)", scrollerdelay)
setTimeout("move2(document.main.document.second)", scrollerdelay)
return
}
if (tlayer.top >= tlayer.document.height * -1) {
tlayer.top -= 5
setTimeout("move1(tlayer)", 50)
} else {
tlayer.top = parseInt(scrollerheight)
tlayer.document.write(messages[i])
tlayer.document.close()
if (i == messages.length - 1)
i = 0
else
i++
}
}
function move2(whichlayer) {
tlayer2 = eval(whichlayer)
if (tlayer2.top > 0 && tlayer2.top <= 5) {
tlayer2.top = 0
setTimeout("move2(tlayer2)", scrollerdelay)
setTimeout("move1(document.main.document.first)", scrollerdelay)
return
}
if (tlayer2.top >= tlayer2.document.height * -1) {
tlayer2.top -= 5
setTimeout("move2(tlayer2)", 50)
} else {
tlayer2.top = parseInt(scrollerheight)
tlayer2.document.write(messages[i])
tlayer2.document.close()
if (i == messages.length - 1)
i = 0
else
i++
}
}
function move3(whichdiv) {
tdiv = eval(whichdiv)
if (parseInt(tdiv.style.top) > 0 && parseInt(tdiv.style.top) <= 5) {
tdiv.style.top = 0 + "px"
setTimeout("move3(tdiv)", scrollerdelay)
setTimeout("move4(second2_obj)", scrollerdelay)
return
}
if (parseInt(tdiv.style.top) >= tdiv.offsetHeight * -1) {
tdiv.style.top = parseInt(tdiv.style.top) - 5 + "px"
setTimeout("move3(tdiv)", 50)
} else {
tdiv.style.top = parseInt(scrollerheight)
tdiv.innerHTML = messages[i]
if (i == messages.length - 1)
i = 0
else
i++
}
}
function move4(whichdiv) {
tdiv2 = eval(whichdiv)
if (parseInt(tdiv2.style.top) > 0 && parseInt(tdiv2.style.top) <= 5) {
tdiv2.style.top = 0 + "px"
setTimeout("move4(tdiv2)", scrollerdelay)
setTimeout("move3(first2_obj)", scrollerdelay)
return
}
if (parseInt(tdiv2.style.top) >= tdiv2.offsetHeight * -1) {
tdiv2.style.top = parseInt(tdiv2.style.top) - 5 + "px"
setTimeout("move4(second2_obj)", 50)
} else {
tdiv2.style.top = parseInt(scrollerheight)
tdiv2.innerHTML = messages[i]
if (i == messages.length - 1)
i = 0
else
i++
}
}
function startscroll() {
if (ie || dom) {
first2_obj = ie ? first2 : document.getElementById("first2")
second2_obj = ie ? second2 : document.getElementById("second2")
move3(first2_obj)
second2_obj.style.top = scrollerheight
second2_obj.style.visibility = 'visible'
} else if (document.layers) {
document.main.visibility = 'show'
move1(document.main.document.first)
document.main.document.second.top = parseInt(scrollerheight) + 5
document.main.document.second.visibility = 'show'
}
}
window.onload = startscroll;
<ilayer id="main" width=&{scrollerwidth}; height=&{scrollerheight}; bgColor=&{scrollerbgcolor}; background={scrollerbackground}; visibility=hide>
<layer id="first" left=0 top=1 width=&{scrollerwidth};>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[0])
</script>
</layer>
<layer id="second" left=0 top=0 width=&{scrollerwidth}; visibility=hide>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[dyndetermine=(messages.length==1)? 0 : 1])
</script>
</layer>
</ilayer>
<script language="JavaScript1.2">
if (ie || dom) {
document.writeln('<div id="main2" style="position:relative;width:' + scrollerwidth + ';height:' + scrollerheight + ';overflow:hidden;background-color:' + scrollerbgcolor + ' ;background-image:url(' + scrollerbackground + ')">')
document.writeln('<div style="position:absolute;width:' + scrollerwidth + ';height:' + scrollerheight + ';clip:rect(0 ' + scrollerwidth + ' ' + scrollerheight + ' 0);left:0px;top:0px">')
document.writeln('<div id="first2" style="position:absolute;width:' + scrollerwidth + ';left:0px;top:1px;">')
document.write(messages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:' + scrollerwidth + ';left:0px;top:0px;visibility:hidden">')
document.write(messages[dyndetermine = (messages.length == 1) ? 0 : 1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</div>')
}
</script>