We needed a pause button to come up over a little slideshow, with opacity .5, as you rolled over it. Oh and also you needed to me able to copy the picture normally (right click or ctrl click). Honestly, it took longer to make the little play and pause buttons in Photoshop than it took to add the feature into a test page and have it work wonderfully on Safari, Opera, Firefox, Camino, Seamonkey on Mac and SeaMonkey on XP and Vista. It’s taken me 2 weeks off and on trying to get this thing to happen in IE. Still no luck.

http://www.megalodon.com/pauseTry3.html

I just this evening pasted in the MS-recommended opacity CSS you posted in your article. It just comes up full opaque in IE. I think it has something to do with it being an image element it’s playing over, but not sure. The earlier version worked

http://www.megalodon.com/pauseTry2.html

but that was before the requirement came down of needing to allow copying of the image. This one used a div positioned (:absolute) over the img to fire the mouseOver, instead of using the image element, which is what pauseTry3 uses. I had to add a 1×1 transparent background to the div to make IE actually fire the mouseOver (worked everywhere else of course).

Is there some IE problem with using transparency over an image element?

I feel that Microsoft’s design philosophy is “slap it together and go on to the next jumping paperclip.” Good design doesn’t sell Windows boxes.

Great article.

Yeah, one more weird decision…

James,

Impossible to tell, but with this approach, you will get opacity for background and text colors.

Thanks for sharing!
While that solution is some interesting thinking, there are moments (more regular occurances in scalable web application scenarios) where having the element outside of the fading element is just too much of a hassle.

Besides, with font resizing and such, it will never be a 100% solution to a problem I’m sure many would like to solve.

link: Non-Transparent Elements Inside Transparent Elements (CSS Tricks)

Cheers

Absolutely, that’s true. But since they stated that it was a bug and were to fix, I didn’t put any more thought into it, really. But thanks for pointing it out!

Funky, I did not know that! Thanks!

We’re all fine, thanks!

Right, it used to be on their agenda. In regards to DHTML Behaviors, I know lots of people used to implement them as IE-specific fixes as well; not very common nowadays, I think (but then again, probably more common than I think ).

They had the “submitted to the W3C” blurb all over the MSDN documentation of their proprietary stuff for years, but finally got rid of it as part of the general tidying-up of the docs that accompanied the release of IE7.

IIRC, DHTML Behaviors were also submitted as a proposed recommendation to the W3C, but quickly died a death.

Hey, how’s it going?
Now when you mention it, I have a very vague recollection of seeing something like that too. But yeah, apparently they just let it go then.

I’m not sure, but feel fairly sure in stating that Microsoft’s suggested filter approach is not submitted to the W3C…

Microsoft’s filter documentation used to say something like “This property has been submitted to the W3C as a proposed addition to CSS” (this was in the late 1990s - early 2000s).

It now simply says that “There is no public specification that applies to this property,” so it seems that they’ve given up on the idea of getting it included as an official CSS property.

That’s really my point. The syntax is a mess, sure, but I’m arguing that they could just go with opacity, and, if necessary, connect it to their filter implementation behind the scenes. No need to put it in the face of developers.

And definitely, it will be a number of extra CSS files for minor issues that really shouldn’t be any issues.

Kamal,

Oh, absolutely. The problem with only using proper code, though, is that Internet Explorer has such a giant market share, and naturally our clients would like their web sites to work in the most-used web browser, so we continue to waste time and their money on adapting, adapting and adapting.

The easiest option would be to spread the word and create our web sites only with the standard/accepted tags and options. Then one day Microsoft will have to adopt to the standards since IE is not displaying major portion of sites in correct format causing users to switch to Firefox like browsers.

Annoying they couldn’t just go with opacity like the other people though (which would have validated) but I guess time constraints and the like meant they had to do it.

That’s true, but as far as I know, that syntax is not recommended, since the performance with it is not as good as the progid approach.

Morgan,

Well, I guess we need to start telling people how much extra it will cost if they want it to work in certain web browsers who doesn’t adhere to general standards.