2010-09-09 4 views
3

Я использую jQuery для размещения элементов в подменю. Html выглядит так:jQuery.css() для IE Только стиль

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

Меню имеет положение: относительное, подменю имеет положение: абсолютное. IE8 и FF представляют подменю непосредственно под меню и выравниваются влево. IE7 размещает подменю в строке с меню, непосредственно после его брата a. В нашем css мы используем «* margin-top: 40px», чтобы переместить меню в нужное место по вертикали.

В нашем javascript мы используем jquery для правильного выравнивания подменю по горизонтали. В FF и IE8, это может быть сделано через: $(this).css("margin-left", $(this).parent().position().left - 1); В IE7 $(this).css("margin-left", -1 * ($(this).siblings('a').width() + 51)); будет правильно выровнять меню (. 51 для заполнения и «это» имеет в виду div.submenu в обоих случаях)

Я попытался изменить 2-й оператор для изменения css для «* margin-left» вместо «margin-left», но это, похоже, не работает. Как я могу сказать jquery использовать 2-ю строку для IE7 и 1-ю строку для всех других браузеров?

Разрешение:

Я попытался это первый, так как метод .browser JQuery является устаревшим. Это не сработало.

<!-- [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.

ответ

4

Вы не можете использовать CSS-хаки, например, * -character в JavaScript. Попробуйте использовать jQuery's $.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); 
} 
4

Вы можете использовать jQuery.browser для проверки IE. Хотя команда jQuery не рекомендуется использовать эту функцию. По возможности используйте функцию обнаружения.

Смежные вопросы