jQuery Plugin To Create Animated Placeholders - placeholderTypewriter

File Size: 5.79 KB
Views Total: 2004
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin To Create Animated Placeholders - placeholderTypewriter

placeholderTypewriter is a small, fancy jQuery plugin which applies a typewriter style text typing animation to the placeholders within your text fields.

See also:

How to use it:

1. Include the latest version of jQuery library (slim build recommended) and jQuery placeholderTypewriter plugin's JavaScript file on the webpage.

<script src="//code.jquery.com/jquery-3.1.0.slim.min.js"></script>
<script src="placeholderTypewriter.js"></script>

2. Call the function on the target text field and specify an array of placeholder text you want to loop through.

$('#search').placeholderTypewriter({
  text: ["Placeholder 1", "Placeholder 2", "Placeholder 3"]
});

3. Config the placeholder text typing effect.

$('#search').placeholderTypewriter({

  // delay between characters
  delay: 50,

  // delay between text
  pause: 1000,
  
});

Change log:

2017-05-23

  • added 'loop' option.

This awesome jQuery plugin is developed by bdiekert. For more Advanced Usages, please check the demo page or visit the official website.