网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料:

 

标题 jQuery基于扩展简单实现倒计时功能的方法
内容
    这篇文章主要介绍了jQuery基于扩展简单实现倒计时功能的方法,涉及jQuery扩展与回调函数的相关使用技巧,需要的朋友可以参考下
    本文实例讲述了jQuery基于扩展简单实现倒计时功能的方法。分享给大家供大家参考,具体如下:
    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程序设计有所帮助。
随便看

 

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

 

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间:2025/5/19 15:29:44