Simple jQuery Content Rotator Plugin - Crotator

File Size: 37.5 KB
Views Total: 8858
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Simple jQuery Content Rotator Plugin - Crotator

Crotator is an autoplay jQuery content rotator/slider that can be used as a quote rotator, text rotator, news ticker, etc.

How to use it:

1. Include the jQuery library and jQuery crotator plugin at the end of the html document.

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

2. Wrap the contents you want to rotate in a wrapper.

<div id="quotes">
<p> Quote 1</p>
<p> Quote 2</p>
<p> Quote 3</p>
...
</div>

3. Initialize the plugin with options.

<script>
$("#quotes").crotator({
// user defined array of time
timeArray: [],

// turn of auto cycling (true/false)
cycle: true,

// start from a empty space (true/false)
startEmpty: false,

// time(in seconds) for which each node will be displayed
timeOfExistence: 1,

// type of tag of each node
typeofTag: "<h3/>",

// class of each node (use it for styling)
tagClass: "",
});
</script>

4. Style the plugin via CSS to meet your needs.

Change logs:

2014-11-23

  • adds user-defined-timeline and other options

2014-05-10

2014-05-07

  • update.

2014-05-03

  • Adds fadeIn method

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