Download: http://github.com/weepy/cssie
Plugin for jQuery providing native support for missing CSS in IE. Currently provides:
- E > F (direct descendant)
- :hover (normally only available to a tags)
- E + F (sibling)
- [rel=attr] (attribute selection)
- :first-child and any other selectors containing : and supported by jQuery
- :focus
- plus others
How it works
- parses the stylesheets for rules that match a regex
- replaces selectors that match with corresponding rules with an internal class .cssie-x (x is an integer)
- add the class cssie-x using the original selector using jQuery
- for :hover and :focus, automatically setup up jQuery events to add/remove the .cssie-x class upon hover/focus
Usage
- include ‘cssie.js’ in your page after ‘jquery.js’
- $.cssie() on the jQuery.ready event
- You can cause the same behaviour on non MSIE browsers with: $.cssie(true)
UPDATE: it also handlers multiple class selectors (e.g .class_a.class_b)
Advertisement
November 13, 2009 at 5:10 pm
Nice job – I like the idea and it will help reduce the amount of IE specific cruft in my markup. And it’s normally purely visual nicities that I’m applying with these types of selectors so I’m happy with it degrading when JS isn’t present.
One other types of selector that I would like to be able to use but which doesn’t work in IE:
* .class-a.class-b (e.g. combinations of multiple classes)
Cheers,
Kelvin
November 13, 2009 at 5:46 pm
Thanks Kevin, it does actually support those – I missed it in the listing.
One thing it doesn’t support at the moment is link tags and style tags. I might add support for those soon.
November 24, 2009 at 12:40 pm
Nice one
Definitely adding it to my toolbox for the next website I start,
Kelvin (not Kevin!)
November 24, 2009 at 4:55 pm
[...] http://www.devbridge.com/projects/autocomplete/jquery/ http://blog.parkerfox.co.uk/2009/11/12/css-in-your-face-only-ie-need-to-apply/ http://benalman.com/code/projects/jquery-bbq/docs/files/jquery-ba-bbq-js.html [...]