自定义jquery方法函数

最新推荐文章于 2021-10-07 08:57:32 发布

原创最新推荐文章于 2021-10-07 08:57:32 发布 · 764 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#function #substring #custom #jquery #clearInterval

jquery 专栏收录该内容

73 篇文章

订阅专栏

本文介绍了一个使用jQuery实现的打字效果插件，通过逐字符显示的方式模拟打字过程，支持HTML标签，并展示了具体的实现代码。

//函数调用

$("#code").typewriter();

//具体函数实现

(function($) {
   $.fn.typewriter = function() {
      this.each(function() {
         var $ele = $(this), str = $ele.html(), progress = 0;
         $ele.html('');
         var timer = setInterval(function() {
            var current = str.substr(progress, 1);
            if (current == '<') {
               progress = str.indexOf('>', progress) + 1;
            } else {
               progress++;
            }
            $ele.html(str.substring(0, progress) + (progress & 1 ? '_' : ''));
            if (progress >= str.length) {
               clearInterval(timer);
            }
         }, 75);
      });
      return this;
   };
})(jQuery);