zoukankan      html  css  js  c++  java
  • 图片连续滚动代码,左右连续,上下连续不间断滚动

    所有的script脚本必须放在后面,否则会出错,在utf-8的模式下请注意空格。

    关键字:图片循环滚动代码 图片上下滚动代码 图片左右滚动代码 图片连续滚动代码 图片向上滚动代码

    向上:
    <base

    href="http://image2.sina.com.cn/gm/lineage2/whz/newwh/images/fy/images/images/ifimage/">

    <div id=demo style="overflow:hidden; 128px; height:300px;">
    <div id=demo1>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    </div>
    <div id=demo2></div>
    </div>
    <script language="javascript">
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    function Marquee(){
    if(demo2.offsetTop-demo.scrollTop<=0)
    demo.scrollTop-=demo1.offsetHeight
    else{
    demo.scrollTop++
    }
    }
    var MyMar=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

    向下:
    <base

    href="http://image2.sina.com.cn/gm/lineage2/whz/newwh/images/fy/images/images/ifimage/">

    <div id=demo style="overflow:hidden; 128px; height:300px;">
    <div id=demo1>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    <img src="gfjs.gif"><br><img src="bxtt.gif"><br><img src="bzjd.gif"><br>
    </div>
    <div id=demo2></div>
    </div>
    <script language="javascript">
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    demo.scrollTop=demo.scrollHeight
    function Marquee(){
    if(demo1.offsetTop-demo.scrollTop>=0)
    demo.scrollTop+=demo2.offsetHeight
    else{
    demo.scrollTop--
    }
    }
    var MyMar=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

    向左:
    <base

    href="http://image2.sina.com.cn/gm/lineage2/whz/newwh/images/fy/images/images/ifimage/">
    <div id=demo style="overflow:hidden;height:100px;300px;"><table align=left

    cellpadding=0 cellspace=0 border=0><tr><td id=demo1 valign=top><img src="gfjs.gif"><img

    src="bxtt.gif"><img src="bzjd.gif"><img src="gfjs.gif"><img src="bxtt.gif"><img

    src="bzjd.gif"></td><td id=demo2 valign=top></td></tr></table></div>
    <script>
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    function Marquee(){
    if(demo2.offsetWidth-demo.scrollLeft<=0)
    demo.scrollLeft-=demo1.offsetWidth
    else{
    demo.scrollLeft++
    }
    }
    var MyMar=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

    向右:
    <base

    href="http://image2.sina.com.cn/gm/lineage2/whz/newwh/images/fy/images/images/ifimage/">
    <div id=demo style="overflow:hidden;height:100px;300px;"><table align=left

    cellpadding=0 cellspace=0 border=0><tr><td id=demo1 valign=top><img src="gfjs.gif"><img

    src="bxtt.gif"><img src="bzjd.gif"><img src="gfjs.gif"><img src="bxtt.gif"><img

    src="bzjd.gif"></td><td id=demo2 valign=top></td></tr></table></div>
    <script>
    var speed=30
    demo2.innerHTML=demo1.innerHTML
    demo.scrollLeft=demo.scrollWidth
    function Marquee(){
    if(demo.scrollLeft<=0)
    demo.scrollLeft+=demo2.offsetWidth
    else{
    demo.scrollLeft--
    }
    }
    var MyMar=setInterval(Marquee,speed)
    demo.onmouseover=function() {clearInterval(MyMar)}
    demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
    </script>

  • 相关阅读:
    LeetCode OJ:Rotate List(旋转链表)
    LeetCode OJ:Gas Station(加油站问题)
    LeetCode OJ:Reverse Nodes in k-Group(K个K个的分割节点)
    Qt实现简单的单例模式
    LeetCode OJ:Merge k Sorted Lists(归并k个链表)
    LeetCode OJ:LRU Cache(最近使用缓存)
    LeetCode OJ:Maximal Rectangle(最大矩形)
    LeetCode OJ:Number of Islands(孤岛计数)
    LeetCode OJ:Valid Sudoku(有效数独问题)
    从hive导入到oracle(Hcatalog)
  • 原文地址:https://www.cnblogs.com/juan/p/1452583.html
Copyright © 2011-2022 走看看