• js-间歇循环滚动


    HTML部分:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="gb2312"/>
    <title>间歇循环滚动</title>
    </head>
    <body>
    <div id="box">
        <ul id="con1">
            <li>111111111111</li>
            <li>222222222222</li>
            <li>333333333333</li>
            <li>444444444444</li>
            <li>555555555555</li>
            <li>666666666666</li>
            <li>777777777777</li>
            <li>888888888888</li>
            <li>999999999999</li>
        </ul>
    </div>
    </body>
    </html>

    CSS部分:

    #box{
            height:240px;
            width:300px;
            margin:0 auto;
            border:1px solid #0066FF;
            overflow:hidden;
            padding-bottom:20px;
       }
       #box li{
            color:#333;
            height:24px;
       }
        #box ul{
            margin:0;
            padding:0;
       }     

    JS部分:

    var area=document.getElementById("box");
    area.innerHTML+=area.innerHTML;
    var liHeight=24;
    area.scrollTop=0;
    var delay=2000;
    var speed=50;
    var time;
    
    function starMove(){
        area.scrollTop++;
        time=setInterval("scrollUp()",speed);
    }
    function scrollUp(){
        if(area.scrollTop%liHeight==0){
        clearInterval(time);
        setTimeout("starMove()",delay);
        }else{
        area.scrollTop++;
        if(area.scrollTop>=area.offsetHeight/2){
        area.scrollTop=0;
        }
        }
    }
    setTimeout("starMove()",delay);
  • 相关阅读:
    程序写法
    2011年C++再次给力
    WIN7+LINUX双系统
    随机洗牌算法
    Eclipse快捷键大全
    Android 编程规范
    android Context 上下文的几点解析
    消息模式Toast.makeText的几种常见用法
    Eclipse的优化
    用PULL解析器解析XML文件
  • 原文地址:https://www.cnblogs.com/lexie/p/6671863.html
Copyright © 2020-2023  润新知