Creating Custom JavaScript Alerts

Slayeroffice has a
nice tutorial
on creating custom JavaScript alert boxes. Custom
alert boxes, in and of themselves, are nothing to write home about, but the
slayeroffice tutorial suggests an interesting twist. Rather than calling your own
alert function, like this…

if (foo) {
myCustomAlert("Hey, you can't do that!");
}

… they suggest actually replacing the default window.alert() function with your
own. There’s plenty of code in the tutorial, but here’s the code that actually
performs the magic:

window.alert = function(txt) {
createCustomAlert(txt);
}

What’s the advantage of overriding the default window.alert() function rather
than calling your own? First, it’s way cooler. But second, it allows you to easily
retrofit existing applications with new and improved alert boxes.
For instance, most web applications include a common header, so in order to change
all the alert boxes for an entire application, you can simply drop some new code
in your application’s header, and magically, all those ugly gray default alert
boxes are transformed. Pretty cool stuff.