十年专注于品牌网站建设 十年专注于品牌网站建设,低调、有情怀的网络应用服务商!
南昌百恒网络微信公众号 扫一扫关注
小程序
tel-icon全国服务热线:400-680-9298,0791-88117053
扫一扫关注百恒网络微信公众号
扫一扫打开百恒网络微信小程序

百恒网络

南昌百恒网络

js无缝滚动只滚动2次就停了的解决办法

百恒网络 2014-03-23 2776

苦B的程序猿们估计都用过无缝滚动js,自从W3C标准出来后,页面加了<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 后,每次JS只滚动2次就停了。
    下面小虫分享一下解决这个问题的方法:大家注意看加了黄底的代码,没错。就加上他们就OK了。左右,上下无缝滚动都一样。
  <div id="scroll_div" class="ks_pic">
  <div style="height:6000000px;">
  <div id="scroll_begin" style="float:left;" >
                <div class="ks_pic_img"><img src='/uploads/1.jpg' border='0' width='126' height='160' ></div>
                <div class="ks_pic_img"><img src='/uploads/1.jpg' border='0' width='126' height='160' ></div>
                <div class="ks_pic_img"><img src='/uploads/1.jpg' border='0' width='126' height='160' ></div>
                <div class="ks_pic_img"><img src='/uploads/1.jpg' border='0' width='126' height='160' ></div>
 </div>
  <div id="scroll_end" style="float:left;" ></div></div>
</div>

<script>      
function ScrollImgLeft(){
  var speed=20,
   doc=document,
   scroll_begin = doc.getElementById("scroll_begin"),
   scroll_end = doc.getElementById("scroll_end"),
   scroll_div = doc.getElementById("scroll_div");
  scroll_end.innerHTML=scroll_begin.innerHTML;
    function Marquee(){
   if(scroll_end.offsetHeight-scroll_div.scrollTop<=0)
     scroll_div.scrollTop-=scroll_begin.offsetHeight
   else
     scroll_div.scrollTop++
    }
  var MyMar=setInterval(Marquee,speed)
    scroll_div.onmouseover=function() {clearInterval(MyMar)}
    scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
  }
  ScrollImgLeft(); 
</script>  
    本文由南昌网络公司品牌百恒网络-小虫原创,欢迎同行一起交流。分享也可以很快乐!

400-680-9298,0791-88117053
扫一扫关注百恒网络微信公众号
扫一扫打开百恒网络小程序

欢迎您的光顾,我们将竭诚为您服务×

售前咨询 售前咨询
 
售前咨询 售前咨询
 
售前咨询 售前咨询
 
售前咨询 售前咨询
 
售前咨询 售前咨询
 
售后服务 售后服务
 
售后服务 售后服务
 
备案专线 备案专线
 
×