Skip to content

Transparent GIF Hack

Working with cross-browser DHTML sucks; and that’s a fact of life. The older the browser, the worst it is because of different DOM implementations. I was trying to set this thing up where you can draw a box outline over an image, and send the coordinates to a PHP program through a form. The event handlers worked fine in Mozilla based browsers, but when IE 4 stepped up to the plate, total failure.

It simply would not capture the click events. After much experimentation, I discovered that my empty div covering the image (and handling the mouse events) was really behaving like it was empty, it was letting the mouse events fall right through to the image (like a box with a hole in the bottom).

If I specified a background color, it worked properly, but then the image was obscured. The fix, a transparent gif as the background for that div and presto, IE 4 was happy.