• js面向对象倒计时与文字左右滚动


    html代码

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
       <!--  <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script> -->
        <script type="text/javascript" src="kg.js"></script>
        <style type="text/css">
        #gongao {
        width: 1000px;
        height: 30px;
        overflow: hidden;
        line-height: 30px;
        font-size: 13px;
        font-family: '宋体';
        background: #DDE5ED;
        color: #0C77CF;
        font-weight: bold;
    }
        #scroll_begin,
        #scroll_end {
            display: inline
        }
        </style>
    </head>
    
    <body>
        <div id="cd_date" time='2018/01/01 00:00:00'>
            <span id="t_d"></span><span id="t_h"></span><span id="t_m"></span><span id="t_s"></span></div>
        <div id="gongao">
            <div style="900px;height:30px;margin:0 auto;white-space: nowrap;overflow:hidden;" id="scroll_div" class="scroll_div">
                <div id="scroll_begin">
                    2017年11月28日开光大典上,上百位缘主欢喜参加法会,共同祈愿诸佛菩萨慈力加被、随缘救众,护佑祖国繁荣昌盛、社会和谐。以此开光殊胜功德祈福世界和平、国泰民安、风调雨顺。
                </div>
                <div id="scroll_end"></div>
            </div>
        </div>
    </body>
    
    </html>

    js代码

    // $(function () {
        window.onload = function(){
        var app = {
            // 文字横向滚动
            scrollWords:function(){
                function ScrollImgLeft(){ 
                    var speed=50;
                    var MyMar = null;
                    var scroll_begin = document.getElementById("scroll_begin"); 
                    var scroll_end = document.getElementById("scroll_end"); 
                    var scroll_div = document.getElementById("scroll_div"); 
                    scroll_end.innerHTML=scroll_begin.innerHTML; 
                    function Marquee(){ 
                        if(scroll_end.offsetWidth-scroll_div.scrollLeft<=0) 
                           scroll_div.scrollLeft-=scroll_begin.offsetWidth; 
                        else
                           scroll_div.scrollLeft++; 
                        } 
                    MyMar=setInterval(Marquee,speed); 
                //     scroll_div.onmouseover = function(){
                //      clearInterval(MyMar);
                //   }
                //   scroll_div.onmouseout = function(){
                //      MyMar = setInterval(Marquee,speed);     
                //   }  
                }
                ScrollImgLeft();
            },
            //倒计时
            coutDown:function(){
                function GetRTime(){
                    var time = document.getElementById('cd_date') .getAttribute('time');
                    // var time = $('#cd_date').attr('time');
                    var EndTime= new Date(time);
                    var NowTime = new Date();
                    var t =EndTime.getTime() - NowTime.getTime();
                    var d=Math.floor(t/1000/60/60/24);
                    var h=Math.floor(t/1000/60/60%24);
                    var m=Math.floor(t/1000/60%60);
                    var s=Math.floor(t/1000%60);
    
                    if (d<10) {
                        d = '0'+d;
                    }
                    if (h<10) {
                        h = '0'+h;
                    }
                    if (m<10) {
                        m = '0'+m;
                    }
                    if (s<10) {
                        s = '0'+s;
                    }
    
                    document.getElementById("t_d").innerHTML = d;
                    document.getElementById("t_h").innerHTML = h;
                    document.getElementById("t_m").innerHTML = m;
                    document.getElementById("t_s").innerHTML = s;
                }
                setInterval(GetRTime,0);            
            },
            init:function () {
                var that = this;
                // 文字横向滚动
                that.scrollWords();
                //倒计时
                that.coutDown();
            }
        }
        app.init();
    // });
    }
  • 相关阅读:
    js中“==”与“===”区别
    java中的除法及求余运算特殊性。
    oracle数据库查询历史某一时刻的表数据
    Java多线程总结(转载)
    I/O之Writer-Reader
    I/O之File
    MYSQL之內链接 左链接 右链接 区别
    ubuntu下编译boost
    linux下编译安装boost库
    搭建无线弱网测试环境
  • 原文地址:https://www.cnblogs.com/chenmiaosong/p/8079332.html
Copyright © 2020-2023  润新知