支付宝赞助帐号:service@kuitao8.com 

jquery实现倒记时的简单例子

Created2015-09-14   Views 1712    Author 懒人程序
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() {
        
        //where do we start?
        if(!to && to != settings.endNumber) { to = settings.startNumber; }
        
        //set the countdown to the starting number
        $(this).text(to).css('fontSize',settings.startFontSize);
        
        //loopage
        $(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);
            }
        });
                
    });
};
 
/* sample usage 
//调用方法
//
$('#countdown').countDown({
    startNumber: 10,
    callBack: function(me) {
        $(me).text('倒记时加载完毕').css('color','#090');
    }
});

上一篇: jquery验证输入框是不是金额或数字
下一篇: JQuery获取服务器时间
支持键盘 ← →

邮件订阅

订阅我们的精彩内容