A simple text elements rotator plugin
JavaScript CSS
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
LICENSE Update LICENSE Aug 29, 2014
README.md Update README.md Aug 29, 2014
jquery.wordrotator.css v0.9.0 Nov 30, 2013
jquery.wordrotator.js v0.9.0 Nov 30, 2013
jquery.wordrotator.min.css v0.9.0 Nov 30, 2013
jquery.wordrotator.min.js v0.9.0 Nov 30, 2013
wordsrotator.jquery.json v0.9.0 Nov 30, 2013



A simple text elements rotator plugin

Visit the project page for more information and usage examples!


Five simple steps to install and configure wordsRotator plugin

Step 1. Include jQuery

Include the last version of jQuery

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Step 2. Include jQuery Words Rotator Code

Insert into your page's head tag:

<link rel="stylesheet" href="jquery.wordrotator.css">
<script src="jquery.wordrotator.js"></script>

Step 3. Include the CSS3 effects

Choose and build the CSS3 animation effects from Animate.css

<link rel="stylesheet" href="animate.css">

Step 4. HTML code

<p>An <span id="myWords"></span> a day keeps the doctor away</p>

Step 5. Javascript code

<script type="text/javascript">
    $(function () {
            words: ['apple', 'apricot', 'avocado']


    autoLoop: true,				//auto rotate words
    randomize: false,				//show random entries from the words array
    stopOnHover: false,				//stop animation on hover
    changeOnClick: false,			//force animation run on click
    animationIn: "flipInY",			//css class for entrace animation
    animationOut: "flipOutY",			//css class for exit animation
    speed: 2000,				//delay in milliseconds between two words
    words: ['apple', 'apricot', 'avocado']	//Array of words, it may contain HTML values


Wordsrotator is licensed under the MIT license.