HTML and CSS Reference
In-Depth Information
Using jQuery to support older browsers
The jQuery JavaScript library uses CSS selectors as a key part of its
normal operation. In order for this to work cross-browser, the authors
of jQuery had to implement CSS selectors in JavaScript. This is handy
if you want to use the latest CSS features but still present more limited
older browsers with your intended design.
Here's a CSS selector that doesn't work
in IE8 and older:
tbody tr:nth-child(2n+1) {
background: #999;
}
The screenshot shows that in IE8 , the
odd rows don't have the gray back-
ground that the rule specifies.
To add IE8 support without messing up your markup, you can add
some jQuery. Start by adding the library itself:
<script src="jquery-1.5.2.min.js">
</script>
In an IE -only code block, use the jQuery selector engine to match the
nodes using the same selector, and add a class to them:
<!--[if lte IE 8]>
<script>
$(document).ready(
function() {
$('tbody tr:nth-child(2n+1)')
.addClass('odd');
}
)
</script>
<style>
tr.odd { background: #999; }
</style>
<![endif]-->
Search WWH ::




Custom Search