zoukankan      html  css  js  c++  java
  • js实现上下滚动的词条

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title></title>
    <style>
    #demo{
    height:154px;
    200px;
    background: pink;
    overflow: hidden;
    }
    #demo ul{
    list-style: none;
    margin: 0px;
    padding:0px;
    100%;
    margin: 0 auto;
    }
    #demo ul li{
    height:22px;
    line-height:22px;
    }
    #demo2 li{
    height:22px;
    list-style:none;
    }
    </style>
    </head>
    <body>
    <div id="demo">
    <ul id="demo1">
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    <li><a href="#">我是没明白</a></li>
    </ul>
    <div id="demo2"></div>
    </div>
    </body>
    <script>
    var speed = 40;
    window.onload = function(){
    var demo = document.getElementById('demo');
    var demo1 = document.getElementById('demo1');
    var demo2 = document.getElementById('demo2');
    demo2.innerHTNL = demo1.innerHTNL;
    function Marquee(){
    if(demo.scrollTop >= demo1.offsetHeight){
    demo.scrollTop =0;
    }else{
    demo.scrollTop = demo.scrollTop + 1;
    }
    }
    var MyMar = setInterval(Marquee,speed);
    }
    </script>
    </html>
    

      

  • 相关阅读:
    SpringCloudStream实例
    Gateway环境搭建,通过YML文件配置
    Hystrix图形化监控
    Hystrix服务降级
    SpringBootのRedis
    springboot之缓存
    springboot整合JPA
    留言板
    Python 京东口罩监控+抢购
    2019年 自我总结
  • 原文地址:https://www.cnblogs.com/TTTK/p/6294284.html
Copyright © 2011-2022 走看看