活动倒计时插件jQuery_CGLCountdownjs

浏览: 291次 日期:2018年07月23日 19:35:37 作者:青格勒

介绍:

一、状态:未开始、进行中、完毕

二、依赖库:JQuery1.7及以上

三、时间格式:天、时、分、秒、毫秒

四、兼容:IE7及以上、主流浏览器

五、大小:

未压缩5kb

压缩版1kb

 

使用方法:

一、引入插件

<script type="text/javascript" src="js/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="js/jQuery_CGLCountdown.min.js"></script>

 

二、写个容器

<div class="time"></div>

 

三、写JS

<script type="text/javascript">
$(function(){
    //www.cenggel.com
    $('.time').CountdownFn({
        CountdownNow: 1532188840000,//当前时间
        CountdownBegin: 1532188850000,//开始时间
        CountdownEnd: 1532188860000,//结束时间
        CountdownTimeVal: 1000,//刷新间隔
        CountdownOff: function(){//活动以过去
            //这里写你的代码
            $('.time').html('倒计时执行完毕:请等待下次活动!');
        },
        CountdownOn: function(d,h,m,s,r){//活动进行中
            //这里写你的代码
            $('.time').html('距离活动结束还有:'+d+'天'+h+'时'+m+'分'+s+'秒'+r+'毫秒')
        },
        CountdownWait: function(d,h,m,s,r){//活动未开始
            //这里写你的代码
            $('.time').html('距离活动开始还有:'+d+'天'+h+'时'+m+'分'+s+'秒'+r+'毫秒')
        }
    });
});
</script>

 

然后你就可以只用这儿插件了。

这里需要后端给前台提供三个参数:

1、当前事件(当前事件不要获取本地的,要不然容易出问题。)

2、开始时间

3、结束时间

 

下载地址:

链接:https://pan.baidu.com/s/1px-E5G-q_CXEnCv6uWDA9A

密码:ju91

文章链接:http://cenggel.com/kyxm/138.html

版权声明:文章《活动倒计时插件jQuery_CGLCountdownjs》由青格勒编写,转载请带上文章链接。

本章内容纯属乱讲,如有雷同,纯属巧合。如有借鉴之处已表明出处。

点击任意位置关闭窗口,感谢您的支持。


打赏规则 - 为了避免对于打赏模式产生误解,说明一下几点内容:

  • 1.打赏纯粹自愿,金额不限,别太多,1块就行;
  • 2.打赏不能作为解答疑问的理由;
  • 3.打赏不能帮你做毕业设计或论文;
  • 4.打赏不能帮你做工作中的项目;
  • 5.打赏就是这不能那不能,只是单纯打赏而已。
  • 5.最后谢谢支持。
关闭
相关文章

2条回应:“活动倒计时插件jQuery_CGLCountdownjs”

  1. 孟辉说道:

    功能比较全,唯一不好就是jq的

  2. 哈哈哈说道:

    这个比较好用,正好能用上,缺点是没有UI,能不能提供点UI?

发表评论

电子邮件地址不会被公开。 必填项已用*标注