In early 2004, 37 Signals popularized the Yellow Fade Technique. Lots of variations followed. Recently, I’ve had to use the YFT on one of my projects but I didn’t like any of the existing alternatives including 37 Signal’s own YFT implementation. And so, I offer my variation to the YFT.
// Yellow fade technique
var yft = {
_shade: {1:'ff', 2:'ee', 3:'dd', 4:'cc', 5:'bb', 6:'aa', 7:'99'},
fadeIn: function(e,i) {
if (i >= 1) {
var elem = $(e)
if (elem) elem.style.backgroundColor = '#ffff' + this._shade[i];
else return;
if (i > 1) {
i -= 1;
setTimeout("yft.fadeIn('"+elem.id+"',"+i+")", 200);
} else {
i -= 1;
setTimeout("yft.fadeIn('"+elem.id+"',"+i+")", 200);
elem.style.backgroundColor = "transparent";
}
}
}
}
Note, that this does require the use of Prototype.