10-09
28
用JS实现的文字上下滚动,并且每滚动一行停顿几秒的效果
作者:Java伴侣 日期:2010-09-28
<style>
div { font-size:12px; }
</style>
<div id="mq" style="width:100%;height:70px;overflow:hidden;border:1px solid #000000" onmouseover="iScrollAmount=0" onmouseout="iScrollAmount=1">
轻轻的我走了,正如我轻轻的来;<br/>
我轻轻的招手,作别西天的云彩。<br/>
<br/>
那河畔的金柳,是夕阳中的新娘;<br/>
波光里的艳影,在我心头荡漾。<br/>
<br/>
</div>
<script>
var oMarquee = document.getElementById("mq"); //滚动对象
var iLineHeight = 14; //单行高度,像素
var iLineCount = 6; //实际行数
var iScrollAmount = 1; //每次滚动高度,像素
function run() {
oMarquee.scrollTop += iScrollAmount;
if ( oMarquee.scrollTop == iLineCount * iLineHeight )
oMarquee.scrollTop = 0;
if ( oMarquee.scrollTop % iLineHeight == 0 ) {
window.setTimeout( "run()", 2000 );
} else {
window.setTimeout( "run()", 50 );
}
}
oMarquee.innerHTML += oMarquee.innerHTML;
window.setTimeout( "run()", 2000 );
</script>
div { font-size:12px; }
</style>
<div id="mq" style="width:100%;height:70px;overflow:hidden;border:1px solid #000000" onmouseover="iScrollAmount=0" onmouseout="iScrollAmount=1">
轻轻的我走了,正如我轻轻的来;<br/>
我轻轻的招手,作别西天的云彩。<br/>
<br/>
那河畔的金柳,是夕阳中的新娘;<br/>
波光里的艳影,在我心头荡漾。<br/>
<br/>
</div>
<script>
var oMarquee = document.getElementById("mq"); //滚动对象
var iLineHeight = 14; //单行高度,像素
var iLineCount = 6; //实际行数
var iScrollAmount = 1; //每次滚动高度,像素
function run() {
oMarquee.scrollTop += iScrollAmount;
if ( oMarquee.scrollTop == iLineCount * iLineHeight )
oMarquee.scrollTop = 0;
if ( oMarquee.scrollTop % iLineHeight == 0 ) {
window.setTimeout( "run()", 2000 );
} else {
window.setTimeout( "run()", 50 );
}
}
oMarquee.innerHTML += oMarquee.innerHTML;
window.setTimeout( "run()", 2000 );
</script>
评论: 0 | 引用: 0 | 查看次数: 397
发表评论