Cross-fading Text Slideshow Plugin For jQuery - Cycletext
| File Size: | 6.22 KB |
|---|---|
| Views Total: | 1720 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Cycletext is a really simple, AMD & UMD compatible text rotator jQuery plugin which automatically fades through an array of predefined text just like a slideshow or carousel. Powered by window.requestAnimationFrame() API.
How to use it:
1. Load both jQuery library and the jQuery Cycletext plugin at the end of the html document.
<script src="//code.jquery.com/jquery-3.1.0.slim.min.js"></script> <script src="cycletext.js"></script>
2. Create an empty DIV element which will be served as the container for your text slideshow.
<div id="example"></div>
3. Define an array of text to be presented in the slideshow.
myWords = ["Hello!", "World!", "jQuery!", "Script!"];
4. Active the plugin to render a basic text slideshow inside the DIV container you just created.
$("#example").cycleText(myWords);
5. Default options to config the text animation.
$("#example").cycleText(myWords,{
fadeInSpeed: 1000,
displayDuration: 2000,
fadeOutSpeed: 1000,
delay: 500
});
This awesome jQuery plugin is developed by jeffreyeaton76. For more Advanced Usages, please check the demo page or visit the official website.











