公众号倒计时素材-微信公众号文章结尾，加上计时器怎么做？

1、首先第一步要直接使用setInterval即可,但是在

微信小程序

中,我们需要用微信小程序的语法,这时就会遇到一个难题,那就是怎么关闭定时器的问题,下面给出实例。WXML代码。

2、接着就是下面是js实现代码// 需要一个目标日期,初始化时,然后就是先得出到当前时间还有剩余多少秒将秒数换成格式化输出为XX天XX小时XX分钟XX秒 XX提供一个时钟,这时候每10ms运行一次,渲染时钟,再总ms数自减10剩余的秒次为零时,return。

3、每10ms都会调用一次function dateformat(micro_second) {// 总秒 var second = (micro_second / 1000);//var day = (second / 3600/24)。

4、最后就用

毫秒

的步长受限于系统的时间频率,于是我们精确到0.01s即10ms}// 时间格式化输出,如1天天23时时12分分12秒秒12 ,微信图文中做倒计时就成功了。

具体操作步骤如下:

1、首先,观察最终效果,即微信

倒计时

的最终效果,如下图所示,然后进入下一步。

2、其次,使用Photoshop软件,制作宽度和高度为750

* 1208像素的图片,以制作引导页。如下图所示,然后进入下一步。

3、接着,登录云直播管理平台,创建新的直播频道,例如“

html5教室”,设置该直播频道的一些基本信息,如下图所示,然后进入下一步。

4、然后,打开引导图开关,并上传上面使用PS制作的引导页的图片,如下图所示,然后进入下一步。

5、随后,打开倒计时功能,并相应地填写倒计时提示语句和直播时间,如下图所示,然后进入下一步。

6、最后,使用微信打开页面(或扫描二维码打开),就会显示制作的倒计时引导图了,如下图所示。这样,问题就解决了。

方法/步骤

打开

微信小程序

开发工具,创建一个微信小程序项目,使用小程序模板

请点击输入图片描述

在项目中找到一个页面并打开文件,添加一个view和label,绑定三个变量h、m和s

请点击输入图片描述

打开跟页面文件同名的JavaScript文件,然后添加Page对象

请点击输入图片描述

在data对象中,定义三个变量h、m和s,并对变量进行初始化

请点击输入图片描述

定义一个方法queryTime,分别定义三个变量hou、min和sec,调用setInterval定时器方法

请点击输入图片描述

接着在onLoad函数中,调用方法queryTime,使用()

请点击输入图片描述

保存代码并对项目进行编译,查看左侧

模拟器

上的

计时器

效果

请点击输入图片描述