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.











