
A JavaScript text-decoration:blink implementation
By:
rplantiko on
May 2nd, 2012 | syntax:
JavaScript | size: 1.85 KB | hits: 63 | expires: Never
/*
"text-decoration:blink" usually is the horror for any webpage
See http://theworldsworstwebsiteever.com/ for a demonstration.
There is an exception where I found it reasonable:
I had the requirement of a countdown which should start to blink during its final 30 seconds.
This makes sense to me.
I use the CSS class
.blink {
text-decoration:blink;
}
which doesn't work for IE, Chrome and Safari, however.
For basic JS-DOM functions I am using minlib.js ( see http://ruediger-plantiko.net/minlib/ )
*/
function Blinker(e) {
this.e = getElement(e);
var theBlinker = this;
this.id = window.setInterval( function() {
theBlinker.blink();
}, Blinker.interval );
}
Blinker.prototype.blink = function() {
var visibility = this.e.style.visibility;
if (this.e.className.match(/\bblink\b/)) {
this.e.style.visibility = (visibility == "hidden") ? "" : "hidden";
}
else {
this.stop();
}
};
Blinker.prototype.stop = function() {
this.e.style.visibility = "";
window.clearInterval( this.id );
};
Blinker.interval = 700;
// Buttons for test page, setting and resetting the "blink" class
function setBlinker(e) {
setClass(byId("test"),"blink");
if (navigator.userAgent.match(/MSIE|Chrome|Safari/)) {
// Need a Blinker instance as soon as the new class is set
new Blinker("test");
}
}
function resetBlinker(e) {
resetClass(byId("test"),"blink");
}
function doOnLoad() {
registerFor( byId("setBlink"), "click", setBlinker );
registerFor( byId("resetBlink"), "click", resetBlinker );
}