Animated Text

Animated Typed Text


|

and Retina Ready

Buy this template

The basic widget HTML markup to display one element looks the following way:

<div class="typed-text-wrap">
  <span class="typed-text"></span>
  <span class="typed-cursor"></span>
</div>

Animated FadeIn Text


and Retina Ready

Buy this template

The basic widget HTML markup to display one element looks the following way:

<div class="textillate" data-loop="true">
  <div class="textillate-text ">
    <span data-in-effect="fadeIn" data-out-effect="fadeOut">
      ...
    </span>
  </div>
</div>

Animated FadeInUp Text


Buy this template

The basic widget HTML markup to display one element looks the following way:

<div class="textillate" data-loop="true">
  <div class="textillate-text ">
    <span data-in-effect="fadeInUp" data-out-effect="fadeOutDown">
      ...
    </span>
  </div>
</div>

Animated Pulse Text


and Retina Ready

Buy this template

The basic widget HTML markup to display one element looks the following way:

<div class="textillate" data-loop="true">
  <div class="textillate-text ">
    <span data-in-effect="pulse" data-out-effect="pulseOut">
      ...
    </span>
  </div>
</div>

Animated lightSpeedIn Text


and Retina Ready

Buy this template

The basic widget HTML markup to display one element looks the following way:

<div class="textillate" data-loop="true">
  <div class="textillate-text ">
    <span data-in-effect="lightSpeedIn" data-out-effect="lightSpeedOut">
      ...
    </span>
  </div>
</div>

Animated Rotate Text


and Retina Ready

Buy this template

The basic widget HTML markup to display one element looks the following way:

<div class="textillate" data-loop="true">
  <div class="textillate-text ">
    <span data-in-effect="rotateIn" data-out-effect="rotateOut">
      ...
    </span>
  </div>
</div>