timecountdown实现时间日期倒计时效果代码

代码语言:html

所属分类:布局界面

代码描述:timecountdown实现时间日期倒计时效果代码

代码标签: 日期 倒计时 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html class="no-js">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  


<style>
    * {
        padding: 0;
        margin: 0;
        font-family: "Lato", sans-serif
    }
    i {
        font-size: 14px
    }
    body {
        background: #0d0d0d;
        color: #ffffff
    }
    div {
        font-size: 20px;
        text-align: center;
        padding-top: 15px;
    }
    div span {
        display: inline-block;
        width: 50px;
        height: 50px;
        padding: 10px;
        border-radius: 5px
    }
    p {
        font-size: 18px
    }
    span.red {
        background: #ff0000
    }
    span.yg {
        background: yellowgreen
    }
    span.or {
        background: orange
    }
    span.pi {
        background: palevioletred
    }
    span.pk {
        background: #00a0e9
    }
    span.mk {
        background: #1FADC5
    }
    span p:first-child {
        font-size: 25px
    }
    span p:last-child {
        font-size: 14px
    }
</style>
</head>
<body>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/timecountdown.js"></script>
    <script type="text/javascript">
        /**
        * time.day 和 time.dayZero 区别
        * time.day 如果是1天 返回 1
        * time.dayZero 如果是1天 则返回 01
        * 除了day拥有Zero外 hour,minute,second,msec都有Zero 即小于10的,都会在前面补0
        */
        window.onload = function() {
            xcsoft.countdown('2028-11-11', function (time) {
                //time.days=总天数
                document.getElementById("y1").innerHTML = time.year
                document.getElementById("d1").innerHTML = time.day
                document.getElementById("h1").innerHTML = time.hourZero
                document.getElementById("i1").innerHTML = time.minuteZero
                document.getElementById("s1").innerHTML = time.secondZero
                document.getElementById("m1").innerHTML = time.msecZero
            }, function (time) {
                //倒计时结束后的操作
            })
            xcsoft.countup('2018-11-11', function (time) {
                document.getElementById("y2").innerHTML = time.year
                document.getElementById("d2").innerHTML = time.day
                document.getElementById("h2").innerHTML = time.hourZero
                document.getElementById("i2").innerHTML = time.minuteZero
                document.getElementById("s2").innerHTML = time.secondZero
            })

            var nes = parseInt(new Date().getTime()/1000)+60;
            xcsoft.countdown(parseInt(nes)+'.3', function (time) {
                document.getElementById("s3").innerHTML = time.secondZero
                document.getElementById("m3").innerHTML = time.msecZero
            })

        }
    <.........完整代码请登录后点击上方下载按钮下载查看

网友评论0