• 把时间数字分割成图片


    效果图:

    html代码:

    <div class="pay">
        <div class="pay-time">
            <p>支付剩余时间</p>
            <div class="time-data">
                <span class="fen1"></span>
                <span class="fen2"></span>
                <i>:</i>
                <span class="miao1"></span>
                <span class="miao2"></span>
            </div>
        </div>
    

     css代码:

    .time-data span{
        display: inline-block;
        padding-left: 0.1rem;
        0.5rem;
        height:0.6rem;
        line-height: 0.6rem;
        background: #ff9b2f;
        font-size: 0.56rem;
        letter-spacing:0.7rem;
        color: #ffffff;
    }
    

      

     js代码:

    //    倒计时
    var intDiff = parseInt(1200); //倒计时总秒数量
    function timer(intDiff) {
        window.setInterval(function () {
            var day = 0,
                hour = 0,
                minute = 0,
                second = 0; //时间默认值
            if (intDiff > 0) {
                day = Math.floor(intDiff / (60 * 60 * 24));
                hour = Math.floor(intDiff / (60 * 60)) - (day * 24);
                minute = Math.floor(intDiff / 60) - (day * 24 * 60) - (hour * 60);
                second = Math.floor(intDiff) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60);
            }
            if (minute <= 9) minute = '0' + minute;
            if (second <= 9) second = '0' + second;
            $('.fen1').html('<s></s>' + (minute+"").charAt(0) );
            $('.fen2').html('<s></s>' + (minute+"").charAt(1) );
            $('.miao1').html('<s></s>' + (second+"").charAt(0) );
            $('.miao2').html('<s></s>' + (second+"").charAt(1) );
            intDiff--;
        }, 1000);
    }
    $(function () {
        timer(intDiff);
    });
    

      

  • 相关阅读:
    Android Wifi BT的工作流程和porting(精)
    ioctl命令详解
    android 编译库过程
    git恢复repo start 后丢失的修改记录
    Android Bluetooth 分析(精)
    SDIO总线 驱动
    提取高通最新代码patch
    linux设备驱动——andriod平台wlan驱动
    推送现有git到远程服务器并创建新分支
    c++继承经典例子
  • 原文地址:https://www.cnblogs.com/yongwang/p/6729055.html
Copyright © 2020-2023  润新知