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 读取XML数据,在页面中展现、编辑、保存的实现
Oct 27 Javascript
js优化针对IE6.0起作用(详细整理)
Dec 25 Javascript
Extjs 继承Ext.data.Store不起作用原因分析及解决
Apr 15 Javascript
用JavaScript计算在UTF-8下存储字符串占用字节数
Aug 08 Javascript
jQuery对Select的操作大集合(收藏)
Dec 28 Javascript
中文输入法不触发onkeyup事件的解决办法
Jul 09 Javascript
微信小程序 绘图之饼图实现
Oct 24 Javascript
Ionic2调用本地SQlite实例
Apr 22 Javascript
深入理解React高阶组件
Sep 28 Javascript
vue自定义全局共用函数详解
Sep 18 Javascript
Vue+Element-U实现分页显示效果
Nov 15 Javascript
vue+element UI实现树形表格
Dec 29 Vue.js
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
使用eAccelerator加密PHP程序
2008/10/03 PHP
深入php处理整数函数的详解
2013/06/09 PHP
PHP_Cooikes不同页面无法传递的解决方法
2014/03/07 PHP
php实现ip白名单黑名单功能
2015/03/12 PHP
ThinkPHP中where()使用方法详解
2016/04/19 PHP
PHP中模糊查询并关联三个select框
2017/06/19 PHP
JQuery最佳实践之精妙的自定义事件
2010/08/11 Javascript
JavaScript中的面向对象介绍
2012/06/30 Javascript
判断文件是否正在被使用的JS代码
2013/12/21 Javascript
jquery中each方法示例和常用选择器
2014/07/08 Javascript
jquery获取复选框checkbox的值的简单实现方法
2016/05/26 Javascript
详解javascript获取url信息的常见方法
2016/12/19 Javascript
Angular 4依赖注入学习教程之InjectToken的使用(八)
2017/06/04 Javascript
Require.js的基本用法详解
2017/07/03 Javascript
axios全局请求参数设置,请求及返回拦截器的方法
2018/03/05 Javascript
微信公众号获取用户地理位置并列出附近的门店的示例代码
2019/07/25 Javascript
jquery实现简单拖拽效果
2020/07/20 jQuery
Vue3+elementui plus创建项目的方法
2020/12/01 Vue.js
python正则表达式中的括号匹配问题
2014/12/14 Python
bat和python批量重命名文件的实现代码
2016/05/19 Python
浅谈python中set使用
2016/06/30 Python
python3+selenium自动化测试框架详解
2019/03/17 Python
Python判断字符串是否xx开始或结尾的示例
2019/08/08 Python
pyecharts动态轨迹图的实现示例
2020/04/17 Python
利用Python实现Json序列化库的方法步骤
2020/09/09 Python
CSS3 media queries + jQuery实现响应式导航
2016/09/30 HTML / CSS
中国旅游网站:途牛旅游网
2019/09/29 全球购物
介绍一下write命令
2014/08/10 面试题
《小小竹排画中游》教学反思
2014/02/26 职场文书
学校百日安全生产活动总结
2014/07/05 职场文书
三严三实民主生活会发言稿
2014/10/13 职场文书
小石潭记导游词
2015/02/03 职场文书
2015年安全生产工作总结范文
2015/04/02 职场文书
创业计划书之香辣虾火锅
2019/09/23 职场文书
python实现大文本文件分割成多个小文件
2021/04/20 Python
淡雅古典唯美少女娇媚宁静迷人写真
2022/03/21 杂记