Super Simple Text Rotator with jQuery and CSS3

Text Rotator is a super tiny jQuery plugin used to sequentially or randomly rotate an array of text with 3D flip effects based on CSS3 transition, transform and perspective properties.

How to use it:

1. Include the latest version of jQuery javascript library in the page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

2. Include jQuery text rotator's javascript and CSS in the page, after jQuery library.

<script type="text/javascript" src="jquery.text-rotator.js"></script>
<link rel="stylesheet" type="text/css" href="jquery.text-rotator.css" />

3. Create an Html element for the text rotator.

<span class="rotate">Demo</span>

4. Create an array of text you want to rotate and initialize the text rotator with options.

<script>
$(".demo1 .rotate").textRotate({
phrases: [
'Text 1',
'Text 2',
'Text 3',
],
animation: 'vertical-rotate',
delay: 1000,
random: true,
phrases: [],
keep_initial: true,
height: '30px',
width: '200px'
});
</script>

---

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