web299.com
全部
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
首页
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
当前位置：
首页
>
网页特效
>
日期和时间
基于HTML5 canvas圆形倒计时器jQuery插件
分类：
日期和时间
日期：
2024-05-14
点击(6)
评论(0)
演 示
免费下载
简介
##### 外部依赖 首先需要引入jQuery和它的依赖文件，以及必要的CSS文件： ```html <link rel="stylesheet" type="text/css" href="css/jquery.classycountdown.min.css" /> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="js/jquery.classycountdown.min.js"></script> <script src="js/jquery.knob.js"></script> <script src="js/jquery.throttle.js"></script> ``` ##### HTML结构 该jQuery计时器插件所需的html结构非常简单，你只需要一个空的div即可： ```html <div class="countdown"></div> ``` ##### 调用插件 在文档加载完毕后，就可以按下面的方法调用该计时器插件： ```html $('.countdown').ClassyCountdown({ theme: "flat-colors", end: $.now() + 10000 }); ``` ##### 配置参数 - theme：用于指定环形倒计时器的主题。可用主题有：flat-colors, flat-colors-wide, flat-colors-very-wide, flat-colors-black, black, black-wide, black-very-wide, black-black, white, white-wide, white-very-wide。 和 white-black - labels：用于在环形倒计时器中显示 天/小时/分钟/秒 的文本。 - style：自定义环形倒计时器的样式。 - labelsOptions：用于指定不同语言的文本的对象。 ##### 方法 - onEndCallback()：当倒计时器倒计时到达0时的回调。
相关推荐
html5浪漫粒子表白文字特效
SlidesJS幻灯片特效
html5瀑布流相册特效
css3 svg实现的情人节表白鲜花动画特效
t-scroll.js基于ES6的DOM元素,过渡动画库插件
纯js写省市区三级联动效果
广告
广告
