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简单体验
Jan 10 Javascript
javascript 冒泡排序 正序和倒序实现代码
Dec 14 Javascript
JQuery each()嵌套使用小结
Apr 18 Javascript
node.js中的console用法总结
Dec 15 Javascript
JS+CSS实现仿雅虎另类滑动门切换效果
Oct 13 Javascript
JS动态创建元素的两种方法
Apr 20 Javascript
jQuery实现鼠标经过购物车出现下拉框代码(推荐)
Jul 21 Javascript
jq给页面添加覆盖层遮罩的实例
Feb 16 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(一)
May 11 Javascript
浅谈ajax请求不同页面的微信JSSDK问题
Feb 26 Javascript
react 兄弟组件如何调用对方的方法示例
Oct 23 Javascript
原生JS无缝滑动轮播图
Oct 22 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用GD库生成高质量的缩略图片
2011/03/09 PHP
基于header的一些常用指令详解
2013/06/06 PHP
php实现mysql封装类示例
2014/05/07 PHP
QQ互联一键登录审核不通过的解决方案
2014/09/10 PHP
php使用memcoder将视频转成mp4格式的方法
2015/03/12 PHP
用Laravel轻松处理千万级数据的方法实现
2020/12/25 PHP
JS模拟多线程
2007/02/07 Javascript
zeroclipboard复制到剪切板的flash
2010/08/04 Javascript
JavaScript.The.Good.Parts阅读笔记(二)作用域&闭包&减缓全局空间污染
2010/11/16 Javascript
javaScript 删除字符串空格多种方法小结
2012/10/24 Javascript
浅析JS运动
2015/12/28 Javascript
jQuery加密密码到cookie的实现代码
2017/04/18 jQuery
react 实现页面代码分割、按需加载的方法
2018/04/03 Javascript
js实现上下左右键盘控制div移动
2020/01/16 Javascript
[49:21]2018DOTA2亚洲邀请赛3月30日 小组赛B组 Effect VS iG
2018/03/31 DOTA
Python基础学习之常见的内建函数整理
2017/09/06 Python
Django实现全文检索的方法(支持中文)
2018/05/14 Python
python脚本监控Tomcat服务器的方法
2018/07/06 Python
python重试装饰器的简单实现方法
2019/01/31 Python
python自动生成model文件过程详解
2019/11/02 Python
keras 自定义loss损失函数,sample在loss上的加权和metric详解
2020/05/23 Python
Python爬虫之Selenium设置元素等待的方法
2020/12/04 Python
英国最大的宝石首饰超市:QP Jewellers
2018/09/23 全球购物
美国领先的男士和女士内衣购物网站:Freshpair
2019/02/25 全球购物
eBay爱尔兰站:eBay.ie
2019/08/09 全球购物
东方通信股份有限公司VC面试题
2014/08/27 面试题
JAVA中运算符的分类及举例
2015/09/12 面试题
酒店公关部经理岗位职责
2013/11/24 职场文书
思想专业自荐信范文
2013/12/25 职场文书
社会保险接收函
2014/01/12 职场文书
林肯就职演讲稿
2014/05/19 职场文书
幼儿园教学工作总结2015
2015/05/12 职场文书
2015年乡镇党务公开工作总结
2015/05/19 职场文书
老乡会致辞
2015/07/28 职场文书
2016年“世界气象日”广播稿
2015/12/17 职场文书
如何开发一个渐进式Web应用程序PWA
2021/05/10 Javascript