Sometimes the most benign things can mix to form a deadly combination. On the new web site, there is a really neat image opacity / mouseover effect. (Speaking of the new site, see the entry below for how to see it if you haven't already!) The short phrases to describe the sections of the image don't tell very much, so someone suggested using the tooltips from another page to display more information without taking up more space. A great idea, indeed!
Merging the mouseover code created by different functions wasn't too challenging, so everything was going really well. Then I fired up Safari to make sure it worked OK in Safari. It worked, but with a very alarming "feature" -- a tooltip that floated over an image with opacity enabled inherited the opacity and became unreadable (the image opacity is set to 30% visible). Clearly, this would be unacceptable.
After trying many different ways to override the opacity of the tooltip, which is drawn using a div, I figured that specifying 100% opacity was probably just saying to use 100% of the inherited value, which was only 30%. I decided next to attack the problem by using the zIndex style, and it was using the zIndex that I finally had some luck. By placing the popup as Z=1, and changing the images from Z=2 when transparent to Z=0 when opaque managed to give acceptable results. Tooltips still are slightly transparent, but readable. Of course, the big mystery is how a div placed below a transparent image (in the Z order) can still inherit the opacity but display on top of the image.
I tell myself it's all in the name of having the best cross-platform web site for the best cross-platform IM program.
Wow, sir, you are crazy. When I make my website I stick to Mozilla/IE, nothing else. I use simple tables, no fancy stuff, and even that can be a pain. I can't imagine doing fancy features for like 18.5 different browsers. E-props to you, Kevin.
I think supporting Safari in such a manner isn't exactly crazy. When I write a page, I check it in Opera, Mozilla, Safari, Konqueror, and IE. So long as a UA supports modern technologies well enough, I don't have a problem developing work-arounds for their nit-picks. (The only notable exception is Mozilla's damned DOM-floating element bug) I used to not support IE at all because it was left back in 1992 but so many crybabies fussed and whined about it that I ended up supporting it. Invariably, it's the only "version" of a page that needs to be almost completely different from the pages generated for other browsers.