一句一句话地显示出来,有点类似于跑马灯效果,文字效果的突出点比较明显,推荐使用。
制作方法: 将下面的代码复制到<body>~</body>里 <script language=JavaScript1.2>
//设置下面的参数(宽度,高度和背景色)可以得到不同的显示效果; var scrollerwidth=500 var scrollerheight=100 var scrollerbgcolor=''
//下面的参数,不想使用背景图的话设为空; var scrollerbackground=''
//下面的参数设置显示内容,可以使用HTML语法改变字体,大小和颜色及连接等; var messages=new Array() messages[0]="::::::::::::::::::::: 示例滚动新闻 :::::::::::::::::::::" messages[1]="<a href='javascript:void(0)'>新奥特真三维虚拟演播室系统顺利通过广电总局检测</a>" messages[2]="<a href='javascript:void(0)'>新奥特参加2001年江苏广播电视暨网络设备展览会成功 </a>" messages[3]="<a href='javascript:void(0)'>九运组委会致函感谢新奥特提供电视字幕,为九运作出重要贡献</a>"
///////下面的代码不要改变//////
if (messages.length>1) i=2 else i=0
function move1(whichlayer){ tlayer=eval(whichlayer) if (tlayer.top>0&&tlayer.top<=5){ tlayer.top=0 setTimeout("move1(tlayer)",3000) setTimeout("move2(document.main.document.second)",3000) return } if (tlayer.top>=tlayer.document.height*-1){ tlayer.top-=5 setTimeout("move1(tlayer)",100) } else{ tlayer.top=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)",3000) setTimeout("move1(document.main.document.first)",3000) return } if (tlayer2.top>=tlayer2.document.height*-1){ tlayer2.top-=5 setTimeout("move2(tlayer2)",100) } else{ tlayer2.top=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 (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5){ tdiv.style.pixelTop=0 setTimeout("move3(tdiv)",3000) setTimeout("move4(second2)",3000) return } if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1){ tdiv.style.pixelTop-=5 setTimeout("move3(tdiv)",100) } else{ tdiv.style.pixelTop=scrollerheight tdiv.innerHTML=messages[i] if (i==messages.length-1) i=0 else i++ } }
function move4(whichdiv){ tdiv2=eval(whichdiv) if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5){ tdiv2.style.pixelTop=0 setTimeout("move4(tdiv2)",3000) setTimeout("move3(first2)",3000) return } if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1){ tdiv2.style.pixelTop-=5 setTimeout("move4(second2)",100) } else{ tdiv2.style.pixelTop=scrollerheight tdiv2.innerHTML=messages[i] if (i==messages.length-1) i=0 else i++ } }
function startscroll(){ if (document.all){ move3(first2) second2.style.top=scrollerheight second2.style.visibility='visible' } else if (document.layers){ document.main.visibility='show' move1(document.main.document.first) document.main.document.second.top=scrollerheight+5 document.main.document.second.visibility='show' } }
window.onload=startscroll </script> <ilayer id=main width="&{ scrollerwidth};" height="&{ scrollerheight};" bgcolor="&{ scrollerbgcolor};" visibility="hide" top="0"> <layer id=first width="300" top="1" left="0"> <script language=JavaScript1.2> if (document.layers) document.write(messages[0]) </script> </layer> <layer id=second width="300" visibility="hide" top="0" left="0"> <script language=JavaScript1.2> if (document.layers) document.write(messages[1]) </script> </layer> </ilayer> <script language=JavaScript1.2> if (document.all){ document.writeln('<span id="main2" style="position:relative; width:'+scrollerwidth+'; height:'+scrollerheight+'; overflow:hiden; background-color:'+scrollerbgcolor+'; background-image:url('+scrollerbackground+')">') document.writeln('<div style="position:absolute; width:'+scrollerwidth+'; height:'+scrollerheight+'; clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0); left:0; top:0">') document.writeln('<div id="first2" style="position:absolute; width:'+scrollerwidth+'; left:0; top:1;">') document.write(messages[0]) document.writeln('</div>') document.writeln('<div id="second2" style="position:absolute; width:'+scrollerwidth+'; left:0; top:0; visibility:hidden">') document.write(messages[1]) document.writeln('</div>') document.writeln('</div>') document.writeln('</span>') } </script> 注意:在message[xxx]中不能含有空格,如下: messages[1]="<table border=0><tr valign=top><td width=80>「 2001/10/26 」</td><td width=10></td><td>服务器现在真的是怪怪的,刚刚还用了新的地址了,一会儿又变<br>成了现在的这个了,真是让我干着急,真对不起大家啊!</td></tr></table>" 正 确 messages[1]="<table border=0><tr valign=top><td width=80>「 2001/10/26 」</td> <td width=10></td><td>服务器现在真的是怪怪的,刚刚还用了新的地址了,一会儿又变 <br>成了现在的这个了,真是让我干着急,真对不起大家啊!</td></tr></table>" 错 误
至此你就可以完成这个实例了。
|