查看: 20997|回复: 47
为你的文章页面加入倒计时功能
本帖最后由 Asiaidc.net 于
08:36 编辑
本方法适用于 帖子, 投票, 发布悬赏, 发起活动, 出售商品 等所有可以使用编辑器的地方,很好的解决了目前倒计时的应用插件无法在上述页面中自定义使用的问题.效果截图如下:
image59.png (14.09 KB, 下载次数: 3)
14:53 上传
image60.png (14.91 KB, 下载次数: 1)
14:54 上传
image69.png (117.64 KB, 下载次数: 0)
11:07 上传
1. 可自定义倒计时标题.
2. 自由设置倒计时结束时间,精确到秒.
3. 可以设置倒计时文字字体大小.
4. 由于目前Discuz! 代码支持至多三个动态参数,需要自定义其他参数时,可根据自己需要自由取舍以上参数.
5. 已知bug
倒计时时间结束后时间全部归零,但刷新页面后会继续工作,需要自己移除页面中的相关代码,可能对您的使用造成一定的不便.
ps:希望有专业知识经验的大牛,可以修改相关的js代码,使其完美.
6.原程序代码来源于网络,版权归原作者所有.
方法步骤 1. 下载附件文档,解压后将countdown.png上传于/static/image/common文件夹下,做Discuz! 代码的图标使用.其余文件也需上传至站点,目录不限.
游客，如果您要查看本帖隐藏内容请
2. 新手可按下图进行设置.
image61.png (99.48 KB, 下载次数: 1)
15:03 上传
3. 提交后,点击详情,进入 编辑 Discuz! 代码页面,按下面文档进行编辑.
标签:
游客，如果您要查看本帖隐藏内容请
===========================
& & &script&
& && &&&$('#countdown').timeTo({
& && && && &timeTo: new Date(new Date('{2}')),&&//设定倒计时时间.
& && && && &displayDays: 2,& & //显示天数,2表示天数的位数为2位数,即最多可以设置倒计时的时间为99天.
& && && && &theme: &black&,& &//主题颜色,默认为white.
& && && && &displayCaptions: true,& & //是否显示字幕
& && && && &fontSize: {3},& &//倒计时字体大小
& && && && &captionSize: 15& & //字幕字体的大小
& && &&&});
& & &/script&
===========================例子:
[countdown=优惠活动倒计时:,10/15/:00]32[/countdown]
文章中使用倒计时功能.
参数提示语:
请输入倒计时标题 如:优惠活动倒计时
请输入倒计时结束时间 正确格式如下: 9/15/:00
请输入时间文字字体大小 如:32
允许使用此代码的用户组:
4. 可根据需要自行修改和完善相关代码.
原创文章,发布地址为 http://bbs.asiaidc.net/thread-116-1-1.html
很好不错！！！！！
专家级菜鸟一枚,修改三日才成此模样,哎.代码均来自网络,很容易即可找到,
一表小文只为借题发挥,抛砖引玉而已!
希望大牛级人物能早日解决那该死的,令人心痛的bug!
相当不错了。
好东西，找了很久啊
謝謝樓主無私分享！
这个貌似没什么用处
文章已发布更新,终于修复了那个令人难以忘怀的 &倒计时时间结束后,刷新页面重新计时&的bug, 并添加提示和其它功能.当然也意味着会出现很多其它新的bug,希望大家能够多多交流与学习.
再次感谢大家的支持!
挺好的东西
挺好的东西
可惜似乎有些冲突,如发表情之类,旧问题刚去,新问题又来了.....
艰苦作战2天的东西算是失败了.
使用中有什么问题建议先停止使用.
当然我的3.2版本是这样,不知道你们的如何,有机会帮忙测试一下.
Powered byjquery.flipcountdown翻页定时器倒计时插件支持时分秒倒计时时间表
分享到 08:45:31
下载资源：770次
下载积分：20分
很不错，美观
xiexiefengxiang
厉害！！！！
本站评论功能暂时取消，后续此功能例行通知。
一、不得利用本站危害国家安全、泄露国家秘密，不得侵犯国家社会集体的和公民的合法权益，不得利用本站制作、复制和传播不法有害信息！
二、互相尊重，对自己的言论和行为负责。
下载该资源用户也下载了
未注册过用户可以点击直接登录哦！
使用注册邮箱登录当前访客身份：游客 [
当前位置：
发布于 日 13时,
现在js的倒计时插件比较多，但想要显示某某活动的持续时间却很少，于是自己写了一个小插件，希望大家可以用到首先插件主要有2个参数，一个是当前时间data-nowTime，另一个是时间点data-pointTime当&当前时间小于时间点，则是倒计时，当&当前时间大于时间点，则是持续时间至于为什么&当前时间还必须设定，而没有&new&Date()来解决，原因是，一般使用倒计时的时候，这个开始时间是从服务器上传来的，取本地时间的话，就可以随便修改本地时间来造成提前开始等不好的结果。还有2个非必须参数，data-strBefore=&距开始还有：&&data-strAfter=&已开始：&这两个参数就是在时间的前面&添加的字符串样式自定义覆盖class即可
代码片段(3)
1.&[图片] QQ截图45.png&&&&
timer.html&~&993B&&&&
&title&&/title&
&meta charset="UTF-8" /&
&!-- jQuery --&
&script src="res/jquery.js"&&/script&
&script src="timer.js"&&/script&
&script type="text/javascript"&
$(function(){
$(".timer").timerInit();
&div class="timer" data-nowTime=" 10:00:00" data-pointTime=" 10:00:00" data-strbefore="距开始还有：" data-strAfter="已开始："&
&span class="timer-str"&&/span&
&span class="timer-d"&0&/span&天
&span class="timer-h"&0&/span&小时
&span class="timer-m"&0&/span&分
&span class="timer-s"&0&/span&秒
&div class="timer" data-nowTime=" 10:00:00" data-pointTime=" 10:00:00" data-strBefore="距开始还有：" data-strAfter="已开始："&
&span class="timer-str"&&/span&
&span class="timer-d"&0&/span&天
&span class="timer-h"&0&/span&小时
&span class="timer-m"&0&/span&分
&span class="timer-s"&0&/span&秒
timer.js&~&2KB&&&&
* 初始化加载
* @author EnoND
$.fn.timerInit = function(option){
$(this).each(function(){
var timerItem = new Object();
var obj = $(this);
timerItem = {
//返回天、小时、分、秒的方法，循环调用即可
getTime : function(){
var result = {"d":timerItem.getPoint("d"), "h":timerItem.getPoint("h"), "m":timerItem.getPoint("m"), "s":timerItem.getPoint("s")};
var str = obj.attr("data-strBefore")||"距开始还有：";
if(Date.parse(timerItem.nowDate)&=Date.parse(timerItem.pointDate)){
str = obj.attr("data-strAfter")||"已开始：";
timerItem.runTime();
timerItem.showTime(str,result.d,result.h,result.m,result.s);
//字符串转时间格式
getDate : function(strDate){
var reg = /-|:| /;
var DI = strDate.split(reg);
return new Date(DI[0], DI[1], DI[2], DI[3], DI[4], DI[5]);
//当前时间增加一秒
runTime : function(){
var parse = Date.parse(timerItem.nowDate);
parse = eval(parse + 1000);
timerItem.nowDate = new Date(parse);
//获得相对时间点的天、小时、分钟和秒
getPoint : function(op){
var nowDateParse = Date.parse(timerItem.nowDate);
var minsec = nowDateParse &= timerItem.pointDateParse?(nowDateParse-timerItem.pointDateParse):(timerItem.pointDateParse-nowDateParse);
var days = 0;
switch(op){
days = minsec / 1000 / 60 / 60 / 24;
days = (minsec / 1000 / 60 / 60)-parseInt((minsec / 1000 / 60 / 60 / 24))*24;
days = (minsec / 1000 / 60) - parseInt((minsec / 1000 / 60 / 60))*60;
days = (minsec / 1000 ) - parseInt((minsec / 1000 / 60))*60;
return parseInt(days);
//显示时间
showTime : function(str,d,h,m,s){
obj.find(".timer-str").html(str);
obj.find(".timer-d").html(d);
obj.find(".timer-h").html(h);
obj.find(".timer-m").html(m);
obj.find(".timer-s").html(s);
timerItem.nowDate = timerItem.getDate(obj.attr("data-nowTime"));
//当前时间date对象
timerItem.pointDate = timerItem.getDate(obj.attr("data-pointTime"));
timerItem.pointDateParse = Date.parse(timerItem.pointDate);
//获得时间点的毫秒数
setInterval(function(){timerItem.getTime();}, 1000);
开源中国-程序员在线工具：
相关的代码(2672)
[JavaScript]
[JavaScript]
[JavaScript]
[JavaScript]
[JavaScript]
[JavaScript]
[JavaScript]
[JavaScript]
[JavaScript]
[JavaScript]
相当不错啊,收下了,谢谢
开源从代码分享开始
EnoND的其他代码如何在PPT上插入一个倒数时间?_百度知道
提问者采纳
在PPT安装一个倒计时插件就行了
看来你也不知道，只是随便过来拿分的！~
提问者评价
太给力了，你的回答完美地解决了我的问题，非常感谢！
采纳率100%
其他类似问题
com/article/e8cdb32b6fbad3d具体看这个操作.html" target="_blank">http://jingyan.baidu： <a href="/article/e8cdb32b6fbad3d
为您推荐：
其他1条回答
在“幻灯片放映”里面有“排练计时”选项，你找找
是在PPT里吗？我的是win8系统
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁jquery时间倒计时插件
jquery时间倒计时插件
21:28:02 发布/17浏览/评论
jquery倒计时插件设置多个自定义倒计时时间，任意设置天、小时、分钟、秒倒计时间功能。
& 本站不保证所提供素材资源的完整性和安全性。
& 请在使用前自行查毒 (这也是您使用其它网络资源所必须注意的)。
& 由本站提供的资源对您的网站或计算机造成严重后果的本站概不负责。
& 推荐使用第三方专业下载工具下载本站软件，使用 WinRAR 解压本站软件。
& 如果这个软件总是不能下载的请点击报告错误,谢谢合作!!
& 下载本站资源，如果服务器暂不能下载请过一段时间重试！
& 如果遇到什么问题，请到本站论坛去咨寻，我们将在那里提供更多 、更好的资源！
& 本站提供的一些商业软件是供学习研究之用，如用于商业用途，请购买正版。
& 本站提供的资源均为网上搜集，如果该资源涉及或侵害到您的版权请立即写信通知我们。
下载"jquery时间倒计时插件"地址
已点击(次)：112
已点击(次)：17
已点击(次)：29
已点击(次)：20
已点击(次)：22
已点击(次)：26
已点击(次)：31
已点击(次)：27