本帖最后由 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
|