Typing with TypedJs

by Chintan Upadhayay

HTML

<div class="sh-caption">Perfect Solution for
  <span class="sh-typing" style="white-space:pre;"></span>
</div>

CSS

.sh-caption {
     font-size: 2.75rem;
     min-height: auto;
     margin-bottom: 1.1em;
     color: #000;
   }
   
   .typed-cursor {
     opacity: 1;
     animation: blink .7s infinite;
   }
   
   @keyframes blink {
     0% {
       opacity: 1;
     }
     50% {
       opacity: 0;
     }
     100% {
       opacity: 1;
     }
   }

JavaScript

/**
 * TypedJs
 * https://github.com/mattboldt/typed.js/
 
 */
! function(t) {
  "use strict";
  var s = function(s, e) {
    this.el = t(s), this.options = t.extend({}, t.fn.typed.defaults, e), this.isInput = this.el.is("input"), this.attr = this.options.attr, this.showCursor = this.isInput ? !1 : this.options.showCursor, this.elContent = this.attr ? this.el.attr(this.attr) : this.el.text(), this.contentType = this.options.contentType, this.typeSpeed = this.options.typeSpeed, this.startDelay = this.options.startDelay, this.backSpeed = this.options.backSpeed, this.backDelay = this.options.backDelay, this.strings = this.options.strings, this.strPos = 0, this.arrayPos = 0, this.stopNum = 0, this.loop = this.options.loop, this.loopCount = this.options.loopCount, this.curLoop = 0, this.stop = !1, this.cursorChar = this.options.cursorChar, this.shuffle = this.options.shuffle, this.sequence = [], this.build()
  };
  s.prototype = {
    constructor: s,
    init: function() {
      var t = this;
      t.timeout = setTimeout(function() {
        for (var s = 0; s < t.strings.length; ++s) t.sequence[s] = s;
        t.shuffle && (t.sequence = t.shuffleArray(t.sequence)), t.typewrite(t.strings[t.sequence[t.arrayPos]], t.strPos)
      }, t.startDelay)
    },
    build: function() {
      this.showCursor === !0 && (this.cursor = t('<span class="typed-cursor">' + this.cursorChar + "</span>"), this.el.after(this.cursor)), this.init()
    },
    typewrite: function(t, s) {
      if (this.stop !== !0) {
        var e = Math.round(70 * Math.random()) + this.typeSpeed,
          o = this;
        o.timeout = setTimeout(function() {
          var e = 0,
            r = t.substr(s);
          if ("^" === r.charAt(0)) {
            var i = 1;
            /^\^\d+/.test(r) && (r = /\d+/.exec(r)[0], i += r.length, e = parseInt(r)), t = t.substring(0, s) + t.substring(s + i)
          }
          if ("html" === o.contentType) {
            var n = t.substr(s).charAt(0);
            if ("<"...