Blinker is a simple animation applied to text on your website. Like the name suggest, it blinks words/letters. This is a quick write up I did while developing my personal website. This is inspired by blinking animation in blocklevel.nl.
Demo
HTML
<div class="header">
<span>B</span>
<span>L</span>
<span>I</span>
<span>N</span>
<span>K</span>
<span>E</span>
<span>R</span>
</div>
Then, for usage just simply call
$('.header').blinker();
interval
- How fast to blink in ms. Default is200
endcolor
- When you leave the cursor, this is the final color. Default is black#000
colors
- Arrays of colors to blink. The default are as below. Credit to FlatUIColors
Default colors
'#e74c3c',
'#f1c40f',
'#3498db',
'#9b59b6',
'#1abc9c',
'#e67e22',
'#95a5a6',
'#34495e',
'#2ecc71',
'#c0392b'
Example
$('.header').blinker({
interval: 500,
endcolor: '#fff',
colors: [
'#111',
'#222',
'#333'
]
});