views:

96

answers:

1

On my web page, I have this CSS:

tr:hover {
    background-color: #f0f;
}

Which works nicely in all browsers except for good ole IE. I know that I can just write some jQuery to add and remove a class on mouse over/out, but I'd prefer not to handicap (albeit ever so slightly) all the other browsers which support :hover properly - so I want to only apply this JS behaviour for the browsers which don't support the pure CSS solution natively.

Of course, we all know that $.browser is deprecated, and we all know that browser sniffing is a bad thing, and every other question on SO has a raft of answers along the lines of "you're not supposed to check for the browser, check for the feature", and that's all well and good in the magical fairy land where these people live, but the rest of us need to get our sites working and looking ok across IE6 and other browsers.

$.support looks like this for IE6 & 7:

leadingWhitespace: false
tbody:             false
objectAll:         false
htmlSerialize:     false
style:             false
hrefNormalized:    false
opacity:           false
cssFloat:          false
scriptEval:        false
noCloneEvent:      false
boxModel:          true

How on earth am I supposed to use these properties to determine whether tr:hover will work?

Yes I know that in this example, it's fairly innocuous and I could probably get away with either not giving IE users that feature, or by simulating it across all browsers, but that's not the point. How are you supposed to stop using $.browser when $.support doesn't come close to replacing it?

+5  A: 

Simple answer - in some circumstances you can't, this is one of those circumstances where I would argue that you should use whatever means necessary to get the job done. Many popular plugins ( datepickers and modal scripts ) need to do this ( eg iframe shim ) or the script wouldn't work properly for a specific ( albeit old ) browser.

However instead of sniffing the userAgent as $.browser does, I would object detect for IE6 or use CC's.

<!--[if IE 6]><script src="/js/ie6.js"></script><![endif]-->

You could also feed a general IE js file and then branch out inside of it based on the version.

meder
+1, because this probably is more reliable than user-agent sniffing, but it doesn't address the problem which is that you want your code to be forward compatible: if IE9 comes out and supports feature X, using an IE-only conditional comment won't work. (I know you could do `[if IE<9]` or something, but that's still sniffing..
nickf
The advantage though of CCs are they can't be spoofed, or well at least not without hacking your registry. I wish jQuery didn't deprecate the $.browser. Must of been a long list of emails to Mr Resig: "You're doing it wrong!"
alex