Minimalist Quote Carousel Plugin With jQuery - simpleQuote
File Size: | 5.15 KB |
---|---|
Views Total: | 3169 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
simpleQuote is a very small text carousel plugin for jQuery that has the ability to fade/rotate through an html list of quotes at a certain speed.
How to use it:
1. Create a list of quotes and add author names using the author
attribute as this:
<ul id="simpleQuote"> <li id="display"> </li> <li author="Chanakya"> Before you start some work, always ask yourself three questions - Why am I doing it, What the results might be and Will I be successful. Only when you think deeply and find satisfactory answers to these questions, go ahead. </li> <li author="DV Gundappa"> Life is a Horse driven cart, Fate its driver. You are the horse, Passengers - as allotted by God. Sometimes rides to a wedding, sometimes to the graveyard. On stumbling, there is always the earth. </li> <li author="Srinivasa Ramanujan"> An equation means nothing to me unless it expresses a thought of God. </li> <li author="Patanjali"> Undisturbed calmness of mind is attained by cultivating friendliness toward the happy, compassion for the unhappy, delight in the virtuous, and indifference toward the wicked. </li> </ul>
2. Download and place the JavaScript file jquery.simpleQuote.js
after JQuery library:
<script src="//code.jquery.com/jquery.min.js"></script> <script src="js/jquery.simpleQuote.js"></script>
3. Call the function on the top element to render a default quote carousel on the webpage.
$("#simpleQuote").simpleQuote();
4. Specify the animation speed in milliseconds.
$("#simpleQuote").simpleQuote({ speed : 5000 });
5. If you want to hide the author names:
$("#simpleQuote").simpleQuote({ speed : 5000 }, { includeAuthor : true } );
This awesome jQuery plugin is developed by PrashanthRaghu. For more Advanced Usages, please check the demo page or visit the official website.