js公告间断滚动效果代码
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js公告间断滚动效果代码</title>
<style>
#Marquee{ height:90px; overflow:hidden;}
#Marquee div{ border:1px solid #DDD3FE; background:#EEECF4; height:88px;}
</style>
</head>
<body>
<div id="Marquee">
<div style="width: 260px; height: 88px">
<Font Size=3 Face="楷体_GB2312">
横向的数据全部显示的时候就由上往下竖着排列由左向右滚动了，偶需要一条信息一条信息的出，要么就是由下向上，一条一条的出，出现的时候停顿一下。知识是人类进步的阶梯，汇集网络众多知识，你的疑问，就是我们要解答的，包括电脑硬件、软件，计算机维修，电脑编程，各种程序的漏洞，网站挂木马等，业界新闻等学习娱乐的好去处 </Font>
</div>
</div>
<script>
var Mar = document.getElementById("Marquee");
var child_div=Mar.getElementsByTagName("div")
var picH = 90;//移动高度
var scrollstep=3;//移动步幅,越大越快
var scrolltime=20;//移动频度(毫秒)越大越慢
var stoptime=3000;//间断时间(毫秒)
var tmpH = 0;
Mar.innerHTML += Mar.innerHTML;
function start(){
if(tmpH < picH){
tmpH += scrollstep;
if(tmpH > picH )tmpH = picH ;
Mar.scrollTop = tmpH;
setTimeout(start,scrolltime);
}else{
tmpH = 0;
Mar.appendChild(child_div[0]);
Mar.scrollTop = 0;
setTimeout(start,stoptime);
}
}
onload=function(){setTimeout(start,stoptime)};
</script></body>
</html>
|
开心洋葱 , 版权所有丨如未注明 , 均为原创丨未经授权请勿修改 , 转载请注明js公告间断滚动效果代码！
