Countdown-倒计时插件 博客分类： jquery jquery插件jquery倒计时倒计时插件jquery

今天我介绍的就是类似这种功能的jquery插件，他不仅能实现上面所述的功能，而且在每个倒计时数字实现动画的过渡效果。

 

文章详情和下载链接

 

 

$(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');

              }

          });

      });

Countdown-倒计时插件