网站logo 天津网站制作
首页 网站建设 网络推广 软件开发 形象设计 价格总表 代理会员 成功案例 联系我们 行业动态
  • ● 国家联合诚信
  • ● 中交集团中咨华科
  • ● 天津双港政务网
  • ● 中国网滨海高新
  • ● 北方五金城
  • ● 环渤海书画
  • ● 零度化工网
  • ● 智慧山创意园区
  • ● 陶陶鞋业
  • ● 天津温州商会
  • ● 天津文化艺术网
  • ● 天津联信电子
  • 首页 >> 知识学堂 >> 正文

    js脚本图片无间隙滚动

    津购科技官方网 www.net-tj.cn   时间:2014-06-25 09:46

    无间隙,速度可自定义,鼠标悬停是停止。
    <div id="demo">
    <div id="indemo">
    <div id="demo1">
    <a href="#"><img src="/jscss/demoimg/wall_s1.jpg" border="0" /></a>
    <a href="#"><img src="/jscss/demoimg/wall_s2.jpg" border="0" /></a>
    <a href="#"><img src="/jscss/demoimg/wall_s3.jpg" border="0" /></a>
    <a href="#"><img src="/jscss/demoimg/wall_s4.jpg" border="0" /></a>
    <a href="#"><img src="/jscss/demoimg/wall_s5.jpg" border="0" /></a>
    <a href="#"><img src="/jscss/demoimg/wall_s6.jpg" border="0" /></a>
    </div>
    <div id="demo2"></div>
    </div>
    </div>
    <script>
    var speed=10;
    var tab=document.getElementById("demo");
    var tab1=document.getElementById("demo1");
    var tab2=document.getElementById("demo2");
    tab2.innerHTML=tab1.innerHTML;
    function Marquee(){
        if(tab2.offsetWidth-tab.scrollLeft<=0)
        tab.scrollLeft-=tab1.offsetWidth
    else{
        tab.scrollLeft++;
        }
    }
    var MyMar=setInterval(Marquee,speed);
    tab.onmouseover=function() {clearInterval(MyMar)};
    tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
    </script>
    以垂直滚动为例,一组图片控制它的滚动条进行滚动,且此时对这组图片进行复制并添加进原图组中,现在就有了两个图片。你可以想象,现在滚动条继续滚动,原来那组图片最后一张图片已经滚至顶端且消失,复制的那组图片的第一张跟在原图最后一张图片出现,此时就会感到图片无间隙的在滚动,也是由于图片滚动的速度比较快。

     

    >>相关新闻
    分享到:
       
    案例 信息  
    搜索按钮
    在线客服: 点击这里给我发消息 点击这里给我发消息
    天津网站制作公司公告
      “播洒光明走进崇高”助盲复...
      万网主机临时域名变更
      即日起公司对外售卖400电...
      4月11日至20日暂停备案...
      紧急通知 国家进行垃圾短信...
    客服中心
    知识学堂 常见问题 备案入口
    js脚本图片无间隙滚动
    Photoshop怎么去除文字
    软件开发流程
    iPhone开发常用的iPho...
    怎样自学编程
    服务器托管
    联系我们
    电话: 022-87310660
      400-8855-901
    传真: 022-87310157
    网址: www.net-tj.cn
    E-mail : tjbuy@tjbuy.com.cn
    www.net-tj.cn Copyright 2005-2012 天津市津购科技有限公司版权所有 天津网站制作咨询热线:022-87310660 400-8855-901
    分享到:
    ICP备 11005272号