来源:ITPOW(www.itpow.com)
系列 2 为屏滚效果,即一屏显示后稍作停留再滚动显示下一屏,此为向右屏滚。
更多资料,请参见 Exhibition系列2-d
示例:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Exhibition系列2-d</title> <style type="text/css"> #msg { width:150px; height:20px; overflow:hidden; background-color:#EEEEEE; } .msgItem { width:150px; height:20px; font-size:14px; } </style> </head> <body> <div> <a href="http://www.itpow.com/" target="_blank">ITPOW www.itpow.com 专业探讨【ASP、JavaScript、XHTML+CSS、SQL Server】</a> <hr> </div> <div id="msg"> <table style="width:900px; border-collapse:collapse" cellpadding="0"> <tr> <td class="msgItem">中华人民共和国</td> <td class="msgItem">四川省人民政府</td> <td class="msgItem">成都市人民政府</td> <td class="msgItem">中华人民共和国</td> <td class="msgItem">四川省人民政府</td> <td class="msgItem">成都市人民政府</td> </tr> </table> </div> <script language="javascript"> <!-- //ITPOW www.itpow.com var msg = document.getElementById("msg"); var msgMinIndex = 3; //不重复消息的总数+1,在向右屏滚中增加了 msgMinIndex 变量,其实在向左屏滚中也用到了 msgMinIndex,只是那是用常量 0 代替的 var msgMaxIndex = 5; //不重复消息的总数*2-1 var msgIndex = 0; //当前消息的索引,即已经完全显示或将要消失的消息的索引 var msgItemWidth = 150; var msgScrollDelay = 5; //滚动延迟时间 var msgScreenDelay = 1000; //一屏延迟时间 function ShowMsg() { if (msgIndex < msgMinIndex) { //一个周期已经滚完,从头再开始 msgIndex = msgMaxIndex; msg.scrollLeft = msgMaxIndex*msgItemWidth; } if (msg.scrollLeft > (msgIndex-1)*msgItemWidth) { //一屏还没有滚到头 msg.scrollLeft--; setTimeout("ShowMsg();", msgScrollDelay); } else { //一屏已经滚完,继续下一屏 msgIndex--; setTimeout("ShowMsg();", msgScreenDelay); } } ShowMsg(); //--> </script> </body> </html>[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]
创建于2005年 渝ICP备05010272号-1
电邮:cftea@126.com