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 相关文章推荐
javascript 清除输入框中的数据
Apr 13 Javascript
Mootools 1.2教程 Tooltips
Sep 15 Javascript
Jquery Ajax学习实例 向页面发出请求,返回XML格式数据
Mar 14 Javascript
JQuery Dialog的内存泄露问题解决方法
Jun 18 Javascript
jQuery对象[0]是什么含义?
Jul 31 Javascript
jQuery中实现prop()函数控制多选框(全选,反选)
Aug 19 Javascript
Angular网络请求的封装方法
May 22 Javascript
微信小程序中换行空格(多个空格)写法详解
Jul 10 Javascript
JavaScript实现拖拽功能
Feb 11 Javascript
RxJS在TypeScript中的简单使用详解
Apr 13 Javascript
JavaScript实现点击切换验证码及校验
Jan 10 Javascript
正则表达式基础与常用验证表达式
Jun 16 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
玛琪朵 Macchiato
2021/03/03 咖啡文化
PHP安装threads多线程扩展基础教程
2015/11/17 PHP
详解WordPress中分类函数wp_list_categories的使用
2016/01/04 PHP
PHP实现超简单的SSL加密解密、验证及签名的方法示例
2017/08/28 PHP
javascript高亮效果的二种实现方法
2008/09/14 Javascript
Mootools 1.2教程 定时器和哈希简介
2009/09/15 Javascript
Javascript 函数中的参数使用分析
2010/03/27 Javascript
js escape,unescape解决中文乱码问题的方法
2010/05/26 Javascript
11款新鲜的jQuery插件[附所有demo下载]
2011/01/24 Javascript
javascript简易缓动插件(源码打包)
2012/02/16 Javascript
jQuery移除元素自动解绑事件实现思路及代码
2014/05/31 Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
2016/06/01 Javascript
浅谈javascript alert和confirm的美化
2016/12/15 Javascript
JS实现仿PS的调色板效果完整实例
2016/12/21 Javascript
Angular.js ng-file-upload结合springMVC的使用教程
2017/07/10 Javascript
浅谈JS获取元素的N种方法及其动静态讨论
2017/08/25 Javascript
基于jQuery ztree实现表格风格的树状结构
2018/08/31 jQuery
微信小程序点击图片实现长按预览、保存、识别带参数二维码、转发等功能
2019/07/20 Javascript
NodeJS http模块用法示例【创建web服务器/客户端】
2019/11/05 NodeJs
WEB前端性能优化的7大手段详解
2020/02/04 Javascript
记录一次websocket封装的过程
2020/11/23 Javascript
Python中的面向对象编程详解(上)
2015/04/13 Python
Python编程入门的一些基本知识
2015/05/13 Python
Python数据分析之获取双色球历史信息的方法示例
2018/02/03 Python
python中数组和矩阵乘法及使用总结(推荐)
2019/05/18 Python
python创建子类的方法分析
2019/11/28 Python
python网络编程之五子棋游戏
2020/05/14 Python
五分钟学会怎么用Pygame做一个简单的贪吃蛇
2021/01/06 Python
体育教育毕业生自荐信
2014/06/29 职场文书
小学课外活动总结
2014/07/09 职场文书
改革共识倡议书
2014/08/29 职场文书
2014办公室副主任四风对照检查材料思想汇报
2014/09/20 职场文书
祖国在我心中演讲稿600字
2014/09/23 职场文书
领导干部考核评语
2015/01/04 职场文书
基于Python编写一个监控CPU的应用系统
2022/06/25 Python
nginx配置指令之server_name的具体使用
2022/08/14 Servers