Customizable Text Typing Effect With jQuery - coolType
File Size: | 5.05 KB |
---|---|
Views Total: | 2326 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Just another jQuery plugin for simulating the typewriter typing effect that allows to print out your text character by character with lots of configuration settings.
How to use it:
1. Import jQuery library and the jQuery coolType plugin's script jquery.coolType.js
into your web project.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.coolType.js"></script>
2. Print out your text on the screen with default settings.
$('SELECTOR').coolType(text);
3. Config the typing animation.
$('SELECTOR').coolType(text,{ typeSpeed: 10, delayBeforeType: 1000, delayAfterType: 3000, });
4. Config the blinking cursor indicator while printing.
$('SELECTOR').coolType(text,{ cursorChar: '█', cursorBlinkSpeed: 300, });
5. More default configuration options and callback functions.
$('SELECTOR').coolType(text,{ // is inline? inline: true, // callbacks onComplete: false, onBeforeType: false, onAfterType: false, // strings that should be typed as a single character. expansions: [ ' ', '>', '<', '"', '&' ] });
This awesome jQuery plugin is developed by chevex. For more Advanced Usages, please check the demo page or visit the official website.