• 欢迎访问开心洋葱网站,在线教程,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入开心洋葱 QQ群
  • 为方便开心洋葱网用户,开心洋葱官网已经开启复制功能!
  • 欢迎访问开心洋葱网站,手机也能访问哦~欢迎加入开心洋葱多维思维学习平台 QQ群
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏开心洋葱吧~~~~~~~~~~~~~!
  • 由于近期流量激增,小站的ECS没能经的起亲们的访问,本站依然没有盈利,如果各位看如果觉着文字不错,还请看官给小站打个赏~~~~~~~~~~~~~!

js公告间断滚动效果代码

实用代码 开心洋葱 1129次浏览 0个评论

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公告间断滚动效果代码
喜欢 (0)

您必须 登录 才能发表评论!

加载中……