jquery插件jquery倒计时插件分享


Posted in Javascript onDecember 27, 2013
$(document).ready(function () {
            /* 延迟函数  */
            jQuery.fn.delay = function (time, func) {
                return this.each(function () {
                    setTimeout(func, time);
                });
            };
            jQuery.fn.countDown = function (settings, to) {
                settings = jQuery.extend({
                    startFontSize: '36px',
                    endFontSize: '12px',
                    duration: 1000,
                    startNumber: 10,
                    endNumber: 0,
                    callBack: function () { }
                }, settings);
                return this.each(function () {
                    if (!to && to != settings.endNumber) { to = settings.startNumber; }
                    //设定倒计时开始的号码
                    $(this).text(to).css('fontSize', settings.startFontSize);
                    //页面动画
                    $(this).animate({
                        'fontSize': settings.endFontSize
                    }, settings.duration, '', function () {
                        if (to > settings.endNumber + 1) {
                            $(this).css('fontSize', settings.startFontSize).text(to - 1).countDown(settings, to - 1);
                        }
                        else {
                            settings.callBack(this);
                        }
                    });
                });
            };
            //使用
            $('#countdown').countDown({
                startNumber: 10,
                callBack: function (me) {
                    $(me).text('All done! This is where you give the reward!').css('color', '#090');
                }
            });
        });
Javascript 相关文章推荐
使用JQUERY进行后台页面布局控制DIV实现左右式
Jan 07 Javascript
JQuery组件基于Bootstrap的DropDownList(完整版)
Jul 05 Javascript
内容滑动切换效果jquery.hwSlide.js插件封装
Jul 07 Javascript
jQuery 3.0中存在问题及解决办法
Jul 15 Javascript
Bootstrap实现input控件失去焦点时验证
Aug 04 Javascript
XMLHttpRequest对象_Ajax异步请求重点(推荐)
Sep 28 Javascript
微信小程序收藏功能的实现代码
Jun 12 Javascript
深入浅出 Vue 系列 -- 数据劫持实现原理
Apr 23 Javascript
使用Phantomjs和Node完成网页的截屏快照的方法
Jul 16 Javascript
layui 动态设置checbox 选中状态的例子
Sep 02 Javascript
Vue+ElementUI使用vue-pdf实现预览功能
Nov 26 Javascript
浅谈鸿蒙 JavaScript GUI 技术栈
Sep 17 Javascript
js中substr,substring,indexOf,lastIndexOf的用法小结
Dec 27 #Javascript
window.open打开页面居中显示的示例代码
Dec 27 #Javascript
JSuggest自动匹配下拉框使用方法(示例代码)
Dec 27 #Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
Dec 27 #Javascript
JS 数字转换研究总结
Dec 26 #Javascript
利用jQuary实现文字浮动提示效果示例代码
Dec 26 #Javascript
js几秒以后倒计时跳转示例
Dec 26 #Javascript
You might like
PHP多线程批量采集下载美女图片的实现代码(续)
2013/06/03 PHP
解析在apache里面给php写虚拟目录的详细方法
2013/06/24 PHP
WordPress开发中用于标题显示的相关函数使用解析
2016/01/07 PHP
php实现购物车产品删除功能(2)
2020/07/23 PHP
在Laravel5.6中使用Swoole的协程数据库查询
2018/06/15 PHP
用js实现的模拟jquery的animate自定义动画(2.5K)
2010/07/20 Javascript
jquery插件tooltipv顶部淡入淡出效果使用示例
2013/12/05 Javascript
jquery each的几种常用的使用方法示例
2014/01/21 Javascript
JS获取鼠标坐标位置实例分析
2016/01/20 Javascript
jQuery+css实现的换页标签栏效果
2016/01/27 Javascript
javascript拖拽效果延伸学习
2016/04/04 Javascript
浅谈关于axios和session的一些事
2017/07/13 Javascript
Vue项目中quill-editor带样式编辑器的使用方法
2017/08/08 Javascript
video.js 一个页面同时播放多个视频的实例代码
2018/11/27 Javascript
Vue 使用计时器实现跑马灯效果的实例代码
2019/07/11 Javascript
[57:59]完美世界DOTA2联赛循环赛 Ink Ice vs LBZS BO2第一场 11.05
2020/11/05 DOTA
使用python开发vim插件及心得分享
2014/11/04 Python
Python调用C# Com dll组件实战教程
2017/10/12 Python
对python3标准库httpclient的使用详解
2018/12/18 Python
详解Python 调用C# dll库最简方法
2019/06/20 Python
Python内存映射文件读写方式
2020/04/24 Python
详解Pytorch显存动态分配规律探索
2020/11/17 Python
详解pandas映射与数据转换
2021/01/22 Python
python FTP编程基础入门
2021/02/27 Python
印度尼西亚手表和包包商店:Urban Icon
2019/12/12 全球购物
体育教育专业毕业生自荐信
2013/11/15 职场文书
职工运动会邀请函
2014/02/02 职场文书
毕业生写求职信的要点
2014/03/04 职场文书
委托书模板
2014/04/04 职场文书
人力资源本科毕业生求职信
2014/06/04 职场文书
学习实践科学发展观心得体会
2014/09/10 职场文书
2014年营销工作总结
2014/11/22 职场文书
谢师宴邀请函
2015/02/02 职场文书
幼儿园教师读书笔记
2015/06/29 职场文书
党员干部学法用法心得体会
2016/01/21 职场文书
2016年秋季趣味运动会开幕词
2016/03/04 职场文书