来源:飞翔下载(www.52z.com)
系列 2 为屏滚效果,即一屏显示后稍作停留再滚动显示下一屏,此为向下屏滚。
更多资料,请参见 Exhibition系列2-b
示例:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"><title>Exhibition系列2-b</title><style type="text/css">#msg{ width:250px; height:50px; overflow:hidden; border:1px solid #666666;}.msgItem{ height:50px; font-size:14px;}a:link,a:visited,a:hover{ font-size:14px;}</style></head><body><div><a href="http://www.52z.com/" target="_blank">飞翔下载 www.52z.com 专业探讨【ASP、JavaScript、XHTML+CSS、SQL Server】</a><hr></div><div id="msg"> <div class="msgItem">欢迎光临飞翔下载 www.52z.com</div> <div class="msgItem">专业探讨【ASP、JavaScript、XHTML+CSS、SQL Server】</div> <div class="msgItem"><a href="http://www.52z.com/ask.asp?cate=%C1%F4%D1%D4" target="_blank">请给飞翔下载留言投稿</a></div></div><script language="javascript"><!--//飞翔下载 www.52z.comvar msg = document.getElementById("msg");msg.innerHTML += msg.innerHTML; //将内容重复,以达到滚动目的,如果内容中含有标签 id,则应手动使内容重复以避免 id 重复var msgMinIndex = 3; //不重复消息的总数+1,在向下屏滚中增加了 msgMinIndex 变量,其实在向上屏滚中也用到了 msgMinIndex,只是那是用常量 0 代替的var msgMaxIndex = 5; //不重复消息的总数*2-1var msgIndex = 0; //当前消息的索引,即已经完全显示或将要消失的消息的索引var msgItemHeight = 50;var msgScrollDelay = 20; //滚动延迟时间var msgScreenDelay = 1000; //一屏延迟时间function ShowMsg(){ if (msgIndex < msgMinIndex) { //一个周期已经滚完,从头再开始 msgIndex = msgMaxIndex; msg.scrollTop = msgMaxIndex*msgItemHeight; } if (msg.scrollTop > (msgIndex-1)*msgItemHeight) { //一屏还没有滚到头 msg.scrollTop--; setTimeout("ShowMsg();", msgScrollDelay); } else { //一屏已经滚完,继续下一屏 msgIndex--; setTimeout("ShowMsg();", msgScreenDelay); }}ShowMsg();//--></script></body></html>[Ctrl+A 全部选择 提示:你可先修改部分代码,再按运行]