JQuery.css () for IE Style Only

Question

I use jQuery to place items in a submenu. The html looks like this:

<div class="menu">
    <div>
        <a>Menu Option</a>
        <div class="submenu">
            <div><a>Submenu Option</a></div>
        </div>
    </div>
</div>

the menu has the position: relative, the submenu has the position: absolute. IE8 and FF represent the submenu directly below the menu and are aligned to the left. IE7 places the submenu in the menu bar, immediately after its brother a. In our css we use "* margin-top: 40px" to move the menu to the desired location vertically.

In our javascript, we use jquery to properly align the submenus horizontally. In FF and IE8, this can be done using: $(this).css("margin-left", $(this).parent().position().left - 1);In IE7, the $(this).css("margin-left", -1 * ($(this).siblings('a').width() + 51));menu will be correctly aligned (the value 51 is for filling and "this" refers to div.submenu in both cases.)

, css "* margin-left" "margin-left", , , . jquery 2- IE7 1- ?

:

, jquery.browser . .

<!-- [if IE 7]>
<script type="text/javascript">
    $(function () {
        $(".submenu").each(function () {
            $(this).css("margin-left", -1 * ($(this).siblings('a').width() + 51));
    });
});
</script>
<![endif]-->

$.browser, . $.support.

Answer 1

CSS-, * -character JavaScript. jQuery $.browser -object, . :

if ($.browser.msie && $.browser.version < 8) {
    // IE 7 or older
    $(this).css("margin-left", -1 * ($(this).siblings('a').width() + 51));
} else {
    // all other browsers
    $(this).css("margin-left", $(this).parent().position().left - 1);
}

Answer 2

jQuery.browser IE. jQuery . .

Answer 3

use conditional comments

<!--[if IE 7]>
Special instructions for IE 7 here
<![endif]-->

read http://www.quirksmode.org/css/condcom.html