dinsdag 1 oktober 2013

transparent divs in IE

I was creating a game that should work fine in IE (9), iPad, and Chrome.
Halfway through I noticed my 'buttons' stayed stationary.

I decided to create a 'hotspot' layer on top of the game using transparent layers.
This way my events would fire, even when there are sprites (transparent, but with a square bounding box floating over the hotspots.
Everything worked fine in Chrome and on Ipad.
Then I tested IE.

No events fired whatsoever. So much so, that I made the hotspots visible by setting the background-color, just to check if they were not building up for some reason on IE.
When I did that, IE worked fine. Turns out transparent divs don't get any mouse or touch events.

Seems logical, but it's really not.
If you have a (partially) transparent image the click does not travel through the transparent part.
And that's how I managed to fix it: to get consistent behaviour, I added a 1 pixel transparent gif (remember those from the old days) to every hotspot.

So using bugs to fix bugs.. Isn't life wonderfull.


Geen opmerkingen:

Een reactie posten