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

js加两个div实现无缝隙滚动图片效果

JavaScript 开心洋葱 1372次浏览 0个评论

 <!– 滚动图片开始 –>
<style type="text/css">
<!–
#yt_demo {
background: #FFF;
overflow:hidden;
width: 730px;
}
#yt_indemo {
float: left;
width: 800%;
}
#yt_demo1 {
float: left;
}
#yt_demo2 {
float: left;
}
–>
</style>
    
    <style>  
#yt_indemo {
    height: 165px;
}    
 </style>
<div id="yt_demo">

<DIV id=yt_indemo>
<DIV id=yt_demo1>content </DIV>
<DIV id=yt_demo2>content </DIV>
</DIV>
                       
</div>
  
    </ul>
 
    </div> 
  <script language="javascript" type="text/javascript">


    <!–
    var speed=30; //数字越大速度越慢
    var yt_tab=document.getElementById("yt_demo");
    var yt_tab1=document.getElementById("yt_demo1");
    var yt_tab2=document.getElementById("yt_demo2");
    yt_tab2.innerHTML=yt_tab1.innerHTML;
    function Marquee(){
    if(yt_tab2.offsetWidth-yt_tab.scrollLeft<=0)
    yt_tab.scrollLeft-=yt_tab1.offsetWidth
    else{
    yt_tab.scrollLeft++;
    }
    }
    var MyMar=setInterval(Marquee,speed);
    yt_tab.onmouseover=function() {clearInterval(MyMar)};
    yt_tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
    –>
    
</script>


开心洋葱 , 版权所有丨如未注明 , 均为原创丨未经授权请勿修改 , 转载请注明js加两个div实现无缝隙滚动图片效果
喜欢 (0)

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

加载中……