<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文字滚动效果js代码</title>
</head>
<body>
<div id=demo style=overflow:hidden;height:100;width:350;background:#214984;color:#ffffff>
<div id=demo1>
兼容多种浏览器的公告栏文字滚动效果js代码<br>
兼容多种浏览器的公告栏文字滚动效果js代码<br>
兼容多种浏览器的公告栏文字滚动效果js代码<br>
兼容多种浏览器的公告栏文字滚动效果js代码<br>
兼容多种浏览器的公告栏文字滚动效果js代码<br>
兼容多种浏览器的公告栏文字滚动效果js代码<br>
兼容多种浏览器的公告栏文字滚动效果js代码<br>
</div>
<div id=demo2></div>
</div>
<script>
var speed=30;
demo2.innerHTML=demo1.innerHTML; //克隆demo1为demo2
function Marquee(){
if(demo2.offsetTop-demo.scrollTop<=0) //当滚动至demo1与demo2交界时
demo.scrollTop-=demo1.offsetHeight; //demo跳到最顶端
else{
demo.scrollTop++;
}
}
var MyMar=setInterval(Marquee,speed) //设置定时器
demo.onmouseover=function() {//鼠标移上时清除定时器达到滚动停止的目的
clearInterval(MyMar);
}
demo.onmouseout=function() { //鼠标移开时重设定时器
MyMar=setInterval(Marquee,speed);
}
</script>
</body>
</html>
兼容多种浏览器的公告栏文字滚动效果js代码
猜你喜欢
转载自liushengit.iteye.com/blog/2338216
今日推荐
周排行