Replacing the standard broken-image graphic

I came across a tricky issue yesterday, and the solution was not published much, so I thought I'd share it.

Scenario: I'm in the process of adding employee photos to our corporate employee directory on our intranet. The photos reside in a folder on the web server, and are dynamically pulled based on the directory entry.

Issue: For employees that don't have pictures, the standard broken-image graphic appears in its place. I wanted a client side (to minimize overhead) solution that would replace the broken-image graphic with a standard graphic that said "picture not available".

The Solution: <img src="photo.jpg" OnError="this.src='error.gif'"> A nice simple solution that was a pain in the ass to find. Props to Herb from Montreal who posted this solution at JavaScript City.