Anchor Link Typing Animation In jQuery - jTyper
File Size: | 4.61 KB |
---|---|
Views Total: | 2033 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

jTyper is a really simple jQuery plugin to create typewriter style typing animations that supports both plain text and anchor links.
How to use it:
1. Link to the necessary JavaScript files as follows:
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"> </script> <script src="jTyper.1.0.0.js"></script>
2. Insert your anchor links to an HTML list.
<ul> <li> <a href="https://en.wikipedia.org/wiki/AngularJS">AngularJS is a JavaScript-based open-source front-end web application framework.</a> </li> <li> <a href="https://reactjs.org/">React is a JavaScript library for building user interfaces.</a> </li> <li> <a href="https://vuejs.org/">Vue.js is an open-source progressive JavaScript framework for building user interfaces. </a> </li> </ul>
3. Call the function jTyper
on the html list.
$(document).ready(function(){ $('ul').jTyper(); });
4. To config the typing animation, pass the following options to the jTyper
function.
$(document).ready(function(){ $('ul').jTyper({ speed: 100, timeout: 3000 }); });
This awesome jQuery plugin is developed by buglessir. For more Advanced Usages, please check the demo page or visit the official website.