Awesome Text Rotator Plugin With Smooth Transitions - textition

File Size: 6.03KB
Views Total: 5181
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Awesome Text Rotator Plugin With Smooth Transitions - textition

textition is a cool jQuery text rotator plugin that allows to add rotating text with smooth transition animations to your web page.


  • Uses CSS3 perspective, transition and transform properties.
  • 5 built-in animations: ease, ease-in, ease-out, ease-in-out and linear
  • No extra CSS styles required.
  • Autoplay on load.
  • Works with modern browsers.
  • Simple and easy to use.

See also:

Basic Usage:

1. Create a container and add a set of text for the text rotator.

<div id="demo">
<p>First text</p>
<p>Second text</p>
<p>Third text</p>

2. Include textition.js script after jQuery javascript library.

<script src=""></script>
<script src="textition.js"></script>

3. Initialize the plugin with options.

$(function() {
speed: 1,
animation: 'linear',
map: {
x: 200,
y: 100,
z: 0
autoplay: true,
interval: 2

4. All the default options.

$(function() {
map: { // Transition distance for each axis in pixels
x: 100,
y: 50,
z: 1000
speed:       1, // Number of seconds that textition animation should take to complete.
animation:   'ease', // ease, ease-in, ease-out, ease-in-out and linear
handler:     'click', // The event handler which start transition.
perspective: 300, // CSS3 perspective property for axis Z
autoplay:    false, // Automatic text changes
interval:    3, // Interval between automatic text changes

This awesome jQuery plugin is developed by dimajt. For more Advanced Usages, please check the demo page or visit the official website.