小型滚动公告板,一次显示一行

<style>
a { font:12px; display:block }
marquee { border: blue 6px double; filter:alpha(style=1,startY=0,finishY=100,startX=100,finishX=100);
background-color:#3366cc;}
</style>
<marquee id="mq" width="100" height="28" direction="up" onmouseover="iScrollAmount=0" onmouseout="iScrollAmount=1">
<a href="#">月圆之夜</a>
<a href="#">紫禁之颠</a>
<a href="#">一剑西来</a>
<a href="#">天外飞仙</a>
</marquee>
<script>
var iLineHeight = 14; //单行高度,像素
var iLineCount = 4; //总行数,像素
var iScrollHeight = ( iLineCount + 1 ) * iLineHeight; //总高度
var iScrollAmount = 1; //每次滚动高度,像素
var oMarquee = document.getElementById("mq"); //滚动对象
function run() {
oMarquee.scrollTop += iScrollAmount;
if ( oMarquee.scrollTop == iScrollHeight ) oMarquee.scrollTop = 0;
if ( oMarquee.scrollTop % iLineHeight == 0 ) {
window.setTimeout( "run()", 2000 );
} else {
window.setTimeout( "run()", 50 );
}
}
oMarquee.stop();
run();
</script>

上一篇: JavaScript实现图片的不间断连续滚动
下一篇: 漂亮的脚本日历
文章来自: 网络
引用通告: 查看所有引用 | 我要引用此文章
Tags:
最新日志:
评论: 1 | 引用: 0 | 查看次数: 5264
发表评论
登录后再发表评论!