Lightweight jQuery Text Blink Effect Plugin - Modern Blink

Modern Blink is a very simple jQuery plugin used to blink your text using CSS3 animation or jQuery animation for old browsers. You can probably extend it to stop the blinking and start it on demand.

See also:

• Neon Light Style jQuery Text Blinking Plugin - Blinker
• jQuery Plugin For Blinking Html Elements - Blinker

Basic Usage:

1. Create a container for the text you want to apply the blink animation.

<p class="demo">Sample Text</p>

2. Load the jQuery javascript library and jQuery Modern Blink plugin at the bottom of your page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.modern-blink.js"></script>

3. Just call the plugin and you're done.

jQuery(function($) {
$('.demo').modernBlink();
});

4. Available options.

<script>
jQuery(function($) {
$('.demo').modernBlink({
duration: 1000, // Duration specified in milliseconds (integer)
iterationCount: "infinite", // Number of times the element should blink ("infinite" or integer)
auto: true // Whether to start automatically or not (boolean)
});
});
</script>

5. Control the animation via callbacks.

<button class="blink-start">Start</button>
<button class="blink-stop">Stop</button>
$('.blink-start').on( 'click', function() {
$('.demo').modernBlink('start');
});
$('.blink-stop').on( 'click', function() {
$('.demo').modernBlink('stop');
});

Change log:

v0.1.3 (2014-08-11)

• update.

---

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