js 文字向上滚动代码

时间：2022-07-02 15:16:10 编辑：袖梨来源：一聚教程网

YPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.***w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

提示：您可以先修改部分代码再运行

<title>文字滚动</title>
<style type="text/<a href=" http: target="_blank">css">
*{ margin:0; padding:0;}
body{ font-size:12px}
ul{ list-style:none; }
bg{https://www.*111**cn.net}
#rollBox{  padding-left:10px; background:#9999FF; overflow:hidden; position:absolute; top:50%; left:50%; margin-top:-10px; margin-left:-155px;}
#rollBox li{ line-}
</style>
<script type="text/javascript">
function $(id) {
    return typeof id == "string" ? document.getElementById(id) : id;
};
function Roller(sId, iDelay, iSpeed, iheight){
    var rollBox = $(sId);
	var iDelay = iDelay||3000;//每次停顿事件。
	var iSpeed=iSpeed||50;//滚动速度。
	var iheight = iheight||20;//容器高度
	var timer = null, pause = false;
	
	var start = function(){
		timer = setInterval(rollUp,iSpeed);
	}
	
	var rollUp = function(){
		if(pause){ return;}
		    rollBox.scrollTop += 2;
			if(rollBox.scrollTop % iheight == 0){
				clearInterval(timer);
				rollBox.appendChild(rollBox.getElementsByTagName('li')[0]);
				rollBox.scrollTop=0;
				setTimeout(start,iDelay);
			}
	}
  
    rollBox.onmouseover = function(){pause = true;}
	rollBox.onmouseout = function(){pause = false;}
  
    setTimeout(start,iDelay);
}
window.onload = function(){
Roller('rollBox', 10000, 50, 20)
}
</script>

提示：您可以先修改部分代码再运行

推荐专题

最新下载

热门教程

js 文字向上滚动代码

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程