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数组
May 11 Javascript
文本有关的样式和jQuery求对象的高宽问题分别说明
Aug 30 Javascript
js实现简单的星级选择器提交效果适用于评论等
Oct 18 Javascript
jQuery多级弹出菜单插件ZoneMenu
Dec 18 Javascript
asp知识整理笔记3(问答模式)
Sep 27 Javascript
详解使用grunt完成requirejs的合并压缩和js文件的版本控制
Mar 02 Javascript
基于HTML5+JS实现本地图片裁剪并上传功能
Mar 24 Javascript
vue iView 上传组件之手动上传功能
Mar 16 Javascript
JavaScript使用prototype原型实现的封装继承多态示例
Aug 31 Javascript
使用pm2自动化部署node项目的方法步骤
Jan 28 Javascript
VUE安装使用教程详解
Jun 03 Javascript
vue+render+jsx实现可编辑动态多级表头table的实例代码
Apr 01 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 数组排序 array_multisort与uasort的区别
2011/03/24 PHP
php array_push()数组函数:将一个或多个单元压入数组的末尾(入栈)
2011/07/12 PHP
php引用计数器进行垃圾收集机制介绍
2012/09/19 PHP
YII模块实现绑定二级域名的方法
2014/07/09 PHP
PHP字符串比较函数strcmp()和strcasecmp()使用总结
2014/11/19 PHP
php传值赋值和传地址赋值用法实例分析
2015/06/20 PHP
Zend Framework实现多文件上传功能实例
2016/03/21 PHP
golang与php实现计算两个经纬度之间距离的方法
2016/07/22 PHP
ThinkPHP中类的构造函数_construct()与_initialize()的区别详解
2017/03/13 PHP
使用JS进行目录上传(相当于批量上传)
2010/12/05 Javascript
js实现运动logo图片效果及运动元素对象sportBox使用方法
2012/12/25 Javascript
js调试系列 初识控制台
2014/06/18 Javascript
JS实现控制表格行文本对齐的方法
2015/03/30 Javascript
微信小程序 图片等比例缩放(图片自适应屏幕)
2016/11/16 Javascript
微信小程序 解析网页内容详解及实例
2017/02/22 Javascript
jQuery实现移动端Tab选项卡效果
2017/03/15 Javascript
ES6入门教程之Array.from()方法
2019/03/23 Javascript
微信小程序基础教程之worker线程的使用方法
2019/07/15 Javascript
JavaScript Canvas编写炫彩的网页时钟
2019/10/16 Javascript
JavaScript实现简单日历效果
2020/09/11 Javascript
Python正则表达式经典入门教程
2017/05/22 Python
Python使用MD5加密算法对字符串进行加密操作示例
2018/03/30 Python
Python拼接微信好友头像大图的实现方法
2018/08/01 Python
Python图像处理库PIL的ImageGrab模块介绍详解
2020/02/26 Python
Spark处理数据排序问题如何避免OOM
2020/05/21 Python
python 使用xlsxwriter循环向excel中插入数据和图片的操作
2021/01/01 Python
HTML5 Web缓存和运用程序缓存(cookie,session)
2018/01/11 HTML / CSS
艺龙旅行网酒店预订:国内、港澳台酒店
2018/06/26 全球购物
Bally巴利中国官网:经典瑞士鞋履、手袋及配饰奢侈品牌
2018/10/09 全球购物
JBL美国官方商店:扬声器、耳机等
2019/12/01 全球购物
餐厅采购员岗位职责
2014/03/06 职场文书
护士节活动总结
2014/08/29 职场文书
学校推普周活动总结
2015/05/07 职场文书
nginx 配置缓存
2022/05/11 Servers
Debian11 Xfce终端光标的颜色怎么设置?
2022/08/14 数码科技