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?