好用的滚动跑马灯

最新推荐文章于 2024-01-10 09:25:11 发布

belin2000

最新推荐文章于 2024-01-10 09:25:11 发布

阅读量227

点赞数

分类专栏： javascript 文章标签： class div function float

javascript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<div style="width:270px; float:left;">
<div id=demo9 style="overflow:hidden;height:145;width:270px; padding-left:10px; text-align:left;">
    <div id=demo10>
      <div style="width:270px; float:left;">
        <div class="title-g">[供应] 俄罗斯闽商选择留 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留守 </div>
        <div class="title-g">[供应] 俄罗斯闽商选 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留守、进 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择场 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留守 </div>
        <div class="title-g">[供应] 俄罗斯闽商选 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留守、进 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择场 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留守 </div>
        <div class="title-g">[供应] 俄罗斯闽商选 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留守、进 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择场 </div>
        <div class="title-g">[供应] 俄罗斯闽商选择留 </div>
        <div style="clear:both;"></div>
      </div>
    </div>
    <div id=demo11></div>
</div>
<script>
    var speed3=40
   demo11.innerHTML=demo10.innerHTML//克隆demo1为demo2
   function Marquee3(){
   if(demo11.offsetTop-demo9.scrollTop<=0)//当滚动至demo1与demo2交界时
   demo9.scrollTop-=demo10.offsetHeight//demo跳到最顶端
   else{
   demo9.scrollTop++
   }
   }
   var MyMar3=setInterval(Marquee3,speed3)//设置定时器
   demo9.οnmοuseοver=function() {clearInterval(MyMar3)}//鼠标移上时清除定时器达到滚动停止的目的
   demo9.οnmοuseοut=function() {MyMar3=setInterval(Marquee3,speed3)}//鼠标移开时重设定时器
   </script>
</div>