连续滚动字幕

 


< html >

< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
< title > JK:支持民族工业,尽量少买X货 title >
< script  language =javascript  defer >

marqueeDiv1.childOffsetWidth
=marqueeDiv1.children[0].offsetWidth;
marqueeDiv1.insertAdjacentHTML(
"beforeEnd",marqueeDiv1.innerHTML+marqueeDiv1.innerHTML);
window.setInterval(
"marqueeDiv1.scrollLeft=(marqueeDiv1.scrollLeft+marqueeDiv1.tempSpeed*1)%marqueeDiv1.childOffsetWidth;",20);

marqueeDiv2.childOffsetHeight
=marqueeDiv2.children[0].offsetHeight;
marqueeDiv2.insertAdjacentHTML(
"beforeEnd",marqueeDiv2.innerHTML+marqueeDiv2.innerHTML);
window.setInterval(
"marqueeDiv2.scrollTop=(marqueeDiv2.scrollTop+marqueeDiv2.tempSpeed*1)%marqueeDiv2.childOffsetHeight;",20);

script >

head >

< body  >
横向连续滚动:
< br >
< div  id =marqueeDiv1  nowrap style ="width:800;overflow:hidden;background-color:#cccccc;"  defaultSpeed =2  tempSpeed =2  onmouseOver ="this.tempSpeed=0;"  onmouseOut ="this.tempSpeed=this.defaultSpeed;" >
< span  style ="width:500;" >
< font  color =red  > 内容1 font >   < font  color =blue  > 内容2 font >   < font  color =black  > 可以通过设置span的width以决定连续之间的空白 font >
span >
div >

< br >
< br >

纵向连续滚动:
< br >
< div  id =marqueeDiv2  nowrap style ="Height:200;overflow:hidden;background-color:#cccccc;"  defaultSpeed =2  tempSpeed =2  onmouseOver ="this.tempSpeed=0;"  onmouseOut ="this.tempSpeed=this.defaultSpeed;" >
< div  style ="height:150px;" >
< font  color =red  > 内容1 font >< br >
< font  color =blue  > 内容2 font >< br >
< font  color =black  > 可以通过设置sub div的height以决定连续之间的空白 font >
div >
div >

body >
html >

你可能感兴趣的:(div,javascript,html)