Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[发布] 为你的文章页面加入倒计时功能

[复制链接]
Asiaidc.net 发表于 2014-9-15 15:18:40 | 显示全部楼层 |阅读模式
本帖最后由 Asiaidc.net 于 2015-10-30 11:29 编辑

本方法适用于 帖子, 投票, 发布悬赏, 发起活动, 出售商品 等所有可以使用编辑器的地方,很好的解决了目前倒计时的应用插件无法在上述页面中自定义使用的问题.效果截图如下:








使用说明


1. 可自定义倒计时标题.
2. 自由设置倒计时结束时间,精确到秒.
3. 可以设置倒计时文字字体大小.
4. 由于目前Discuz! 代码支持至多三个动态参数,需要自定义其他参数时,可根据自己需要自由取舍以上参数.
5. 已知bug
倒计时时间结束后时间全部归零,但刷新页面后会继续工作,需要自己移除页面中的相关代码,可能对您的使用造成一定的不便.
ps:希望有专业知识经验的大牛,可以修改相关的js代码,使其完美.
6.原程序代码来源于网络,版权归原作者所有.

方法步骤


1. 下载附件文档,解压后将countdown.png上传于/static/image/common文件夹下,做Discuz! 代码的图标使用.其余文件也需上传至站点,目录不限.

2. 新手可按下图进行设置.

3. 提交后,点击详情,进入 编辑 Discuz! 代码页面,按下面文档进行编辑.
标签:
countdown

替换内容:
<hr class="l" />
<strong><font size="4"><font color="Red">{1}</font></font></strong><br />
<hr class="l" /><br />
<div>
     <div id="countdown"></div>
<link  type="text/css" rel="stylesheet"/>
   
     <script>window.jQuery || document.write('<script src="http://替换为你的文件路径/jquery-1.9.1.min.js"><\/script>')</script>
     <script src="http://替换为你的文件路径/jquery.timeTo.min.js"></script>
     <script>
         $('#countdown').timeTo({
             timeTo: new Date(new Date('{2}')),
             displayDays: 2,
             theme: "black",
             displayCaptions: true,
             fontSize: {3},
             captionSize: 15
         });
     </script>
</div>
===========================
参数说明:
    <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/2014 18:00:00]32[/countdown]

解释:
文章中使用倒计时功能.

参数个数:
3

参数提示语:
请输入倒计时标题 如:优惠活动倒计时
请输入倒计时结束时间 正确格式如下: 9/15/2014 18:15:00
请输入时间文字字体大小 如:32

嵌套次数:
3

允许使用此代码的用户组:
自定义

4. 可根据需要自行修改和完善相关代码.


原创文章,发布地址为 http://bbs.asiaidc.net/thread-116-1-1.html


本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
 楼主| Asiaidc.net 发表于 2014-9-15 16:45:54 | 显示全部楼层
专家级菜鸟一枚,修改三日才成此模样,哎.代码均来自网络,很容易即可找到,
一表小文只为借题发挥,抛砖引玉而已!
希望大牛级人物能早日解决那该死的,令人心痛的bug!


回复

使用道具 举报

maque365 发表于 2014-9-16 09:30:23 | 显示全部楼层
相当不错了。
回复

使用道具 举报

法海的春天 发表于 2014-9-16 12:40:01 | 显示全部楼层
好东西,找了很久啊
回复

使用道具 举报

ohalu 发表于 2014-9-16 15:22:27 | 显示全部楼层
謝謝樓主無私分享!
回复

使用道具 举报

独孤羽 发表于 2014-9-17 10:18:21 | 显示全部楼层
这个貌似没什么用处
回复

使用道具 举报

 楼主| Asiaidc.net 发表于 2014-9-17 17:18:42 | 显示全部楼层
文章已发布更新,终于修复了那个令人难以忘怀的 "倒计时时间结束后,刷新页面重新计时"的bug, 并添加提示和其它功能.当然也意味着会出现很多其它新的bug,希望大家能够多多交流与学习.
再次感谢大家的支持!
回复

使用道具 举报

墨樱奈奈 发表于 2014-9-17 17:34:51 | 显示全部楼层
挺好的东西
回复

使用道具 举报

 楼主| Asiaidc.net 发表于 2014-9-17 18:01:19 | 显示全部楼层

可惜似乎有些冲突,如发表情之类,旧问题刚去,新问题又来了.....
艰苦作战2天的东西算是失败了.
使用中有什么问题建议先停止使用.
当然我的3.2版本是这样,不知道你们的如何,有机会帮忙测试一下.
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-11-15 17:43 , Processed in 0.027079 second(s), 4 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表