//marquee标签
<!-- marquee标签实现信息滚动 -->
<!-- 1.behavior滚动方式
alternate:两端之间来回滚动
scroll:表示一端滚动到另一端,会重复
slide:表示一端滚动到另一端,不会重复
2.direction:up,down,left,right;
3.scrollamount设定活动字幕滚动速度
4.loop滚动次数。loop=-1表示无限次滚动
5.scrolldelay字幕滚动两次之间的延迟
//实现无缝滚动
<script type="text/javascript">
var area=document.getElementById("moocBox");
var con1=document.getElementById("con1");
var con2=document.getElementById("con2");
var time=50;//方便修改
area.scrollTop=0;
con2.innerHTML=con1.innerHTML;
function upScroll(){
if (area.scrollTop>=con1.offsetHeight) {
area.scrollTop=0;
} else {
area.scrollTop++;
}
}
var myScroll=setInterval('upScroll()',time);
area.onmouseover=function(){
clearInterval(myScroll);
};
area.onmouseout=function(){
myScroll=setInterval("upScroll()",time);
};
</script>
//实现暂停后无缝滚动
<script type="text/javascript">
var aera=document.getElementById("moocBox");
aera.innerHTML+=aera.innerHTML;//实现无缝滚动,克隆自身
aera.scrollTop=0;//初始值
var iLiHeight=48;//行间距,可改为48,则两行显示
var timer;//定时器
var speed=50;
var delay=2000;
function startMove(){
aera.scrollTop++;
timer=setInterval('scrollUp()',speed)
}
function scrollUp(){
//aera.scrollTop++;
if (aera.scrollTop%iLiHeight==0) {
clearInterval(timer);
setTimeout('startMove()',delay);
} else{
aera.scrollTop++;
if (aera.scrollTop>=aera.scrollHeight/2) {
aera.scrollTop=0;
}
}
}
setTimeout("startMove()",delay);
</script>
js信息滚动marquee标签
最新推荐文章于 2024-01-17 14:58:55 发布