Simple jQuery Text Rotator with CSS3 Animations

Text-Rotator is a JQuery plugin used to rotate comma separated words/phrases with a variety of cool CSS3 animations based on animate.css.

See also:

• jQuery & CSS3 Based Text Rotator Using Animate.css
• Simple Text Rotator Plugin with jQuery and CSS3 Animations - Morphext
• Lightweight jQuery Text Rotator Plugin - Dynamo.js

How to use it:

1. Load jQuery library and the JQuery text-rotator plugin (Animate.css is integrated) at the bottom of the document.

<script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="text-rotator.js"></script>

2. Wrap the comma separated words/phrases into an inline element.

We are <span class="rotate=demo">Web Developers, Front-end Developers, Web/Mobile Designers</span>.

3. Call the plugin on the inline element to active the text rotator.

$('.rotate-demo').textRotator();

4. Full plugin options to control the text rotator.

$('.rotate-demo').textRotator({

// animation types
// http://daneden.github.io/animate.css/
animation: "fadeIn",

// custom sprator
seprator: ",",

// animation speed in ms
speed: "2000"

});

---

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