By: John Gallant , Holly Bergevin
“In Part One of this CSS Tooltips series, we covered the basic coding necessary to create a hovered pop-up that can serve as a supplemental "tooltip" explanation for a link. The next step is to arrange for this effect to be used with any page element, and not just links.
A Matter Of Support
The heart of the CSS tooltip method depends on the :hover pseudo-class. The W3C makes no restrictions as to which elements may be in the :hover state. In theory this means it can apply to any page element. Most modern browsers now support this CSS 2 feature, but sadly, Internet Explorer for Windows lags behind in this area. IE/Win supports the CSS :hover pseudo-class only on link elements. It's really too bad, because having clean CSS tooltips for an image or a complex math formula would be highly desirable to most authors.
However, it happens that IE5/Win and above can be made to support hovering on any element, via a (freely available) jscript called from within the CSS file. Microsoft calls this proprietary "pathway" for the Jscript a behavior. Calling a script from within a CSS file is a non-valid use of CSS, and normally we would not recommend any such thing. But in this case it's a matter of making IE "support" a standard CSS rule that it otherwise would not.
Further, it's possible to place this "behavior call" in a separate style sheet and link that CSS into a page from within a conditional comment (also Microsoft proprietary code) that appears to other browsers as just a normal comment. Only IE will look inside and see the behavior code lurking within!
Thus, for us code purists the result is nice clean HTML and CSS, with all the invalid code squirreled away out of sight. Explorer can see that invalid code only because it is capable of looking inside HTML comments for extra code it can parse. The W3C specifications don't care what lies within any HTML comments, so the page will validate just fine. ”
http://www.communitymx.com/content/article.cfm?cid=52428
Posts
No comments:
Post a Comment