使用 canvas 实现倒计时

countdown

使用 canvas 实现一款酷炫的倒计时web应用

介绍

主要功能 : 倒计时
特点 :

用小球绘制数字 当时间变化,数字对应的小球进行散落 小球弹跳

看起来很酷炫 ...

使用 基本使用

下载, 然后双击 index.html
(默认是距离当前时间 1 小时 10 分钟倒计时)

自定义倒计时时间

打开 index.js, 找到 timeStop, 修改其值来自定义倒计时时间 :

timeStop = { hours: 1, // 设置小时数, 要求 : <=99 miniutes: 0, // 设置分钟数, 要求 : <=59 seconds: 10 // 设置秒数, 要求 : <=59 }

双击 index.html, 就可以开始距当前时间 timeStop.hours 小时, timeStop.miniutes 分钟, timeStops.seconds 秒的倒计时

Todo 用小球来绘制数字 小球绘制截止时间 开始进行倒计时 添加小球落下实验 : 完成小球落下 小球落下实验: 碰撞检测 小球落下实验: 增加阻力, 添加摩擦参数 时间变换,小球出现 性能优化 : 去掉出现在屏幕之外的小球 屏幕自适应 修复屏幕自适应的bug 并可以方便自定义 停止时间

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。