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 相关文章推荐
非常好的js代码
Jun 27 Javascript
Add Formatted Data to a Spreadsheet
Jun 12 Javascript
15款优秀的jQuery导航菜单插件分享
Jul 19 Javascript
Javascript异步编程的4种方法让你写出更出色的程序
Jan 17 Javascript
关于Javascript加载执行优化的研究报告
Dec 16 Javascript
浅谈js数据类型判断与数组判断
Aug 29 Javascript
使用base64对图片的二进制进行编码并用ajax进行显示
Jan 03 Javascript
关于Node.js的events.EventEmitter用法介绍
Apr 01 Javascript
JavaScript之面向对象_动力节点Java学院整理
Jun 29 Javascript
vue不通过路由直接获取url中参数的方法示例
Aug 24 Javascript
封装 axios+promise通用请求函数操作
Aug 11 Javascript
vue实现简单计算商品价格
Sep 14 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应用技巧
2008/03/27 PHP
php与paypal整合方法
2010/11/28 PHP
PHP判断指定时间段的2个方法
2014/03/14 PHP
PHP中Session和Cookie是如何操作的
2015/10/10 PHP
Laravel框架表单验证操作实例分析
2019/09/30 PHP
利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
2007/03/24 Javascript
JS 操作Array数组的方法及属性实例解析
2014/01/08 Javascript
jquery实现省市select下拉框的替换(示例代码)
2014/02/22 Javascript
使用JQ来编写最基本的淡入淡出效果附演示动画
2014/10/31 Javascript
js实现进度条的方法
2015/02/13 Javascript
javascript实现简单的省市区三级联动
2015/05/14 Javascript
搭建简单的nodejs http服务器详解
2017/03/09 NodeJs
python爬取安居客二手房网站数据(实例讲解)
2017/10/19 Javascript
Vue项目使用CDN优化首屏加载问题
2018/04/01 Javascript
vue配置多页面的实现方法
2018/05/22 Javascript
python采集百度百科的方法
2015/06/05 Python
python实现生命游戏的示例代码(Game of Life)
2018/01/24 Python
Django 限制用户访问频率的中间件的实现
2018/08/23 Python
Flask框架学习笔记之消息提示与异常处理操作详解
2019/08/15 Python
Python抓新型冠状病毒肺炎疫情数据并绘制全国疫情分布的代码实例
2020/02/05 Python
python2 对excel表格操作完整示例
2020/02/23 Python
django中related_name的用法说明
2020/05/20 Python
python 装饰器的基本使用
2021/01/13 Python
HTML5之多线程(Web Worker)
2019/01/02 HTML / CSS
html5需遵循的6个设计原则
2016/04/27 HTML / CSS
语文教学感言
2014/02/06 职场文书
党员教师工作决心书
2014/03/13 职场文书
心理咨询承诺书
2014/05/20 职场文书
2014年教师德育工作总结
2014/11/10 职场文书
写给领导的感谢信
2015/01/22 职场文书
研究生个人学年总结
2015/02/14 职场文书
2015年爱国卫生工作总结
2015/04/22 职场文书
针对吵架老公保证书
2015/05/08 职场文书
2015小学音乐教师个人工作总结
2015/07/21 职场文书
CSS3实现360度循环旋转功能
2022/02/12 HTML / CSS
解决Vmware虚拟机安装centos8报错“Section %Packages Does Not End With %End. Pane Is Dead”
2022/06/01 Servers