jQuery基于扩展简单实现倒计时功能的方法
本文实例讲述了jQuery基于扩展简单实现倒计时功能的方法。分享给大家供大家参考，具体如下：
jQuery.fn.countDown=function(settings,to){
settings=jQuery.extend({
startFontSize:'36px',
endFontSize:'12px',
duration:1000,
startNumber:10,
endNumber:0,
callBack:function(){}
},settings);
returnthis.each(function(){
//wheredowestart?
if(!to&&to!=settings.endNumber){to=settings.startNumber;}
//setthecountdowntothestartingnumber
$(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);
}
});
});
};
/*sampleusage
//调用方法
//
$('#countdown').countDown({
startNumber:10,
callBack:function(me){
$(me).text('倒计时加载完毕').css('color','#090');
}
});
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery日期与时间操作技巧总结》、《jQuery切换特效与技巧总结》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》
希望本文所述对大家jQuery程序设计有所帮助。