Анимация непрозрачности jQuery, искажающая позиционирование в Internet Explorer

StackOverflow https://stackoverflow.com/questions/1424824

Вопрос

Я пытаюсь реализовать эффект, похожий на щелчок, в моем горизонтальном меню вкладок, используя свойство непрозрачности и функцию анимации jQuery. Вот код для этого:

$(document).ready(function() {      
    $("div#header > ul > li").click(function(event) {
        $(this).animate({opacity: 0.7} ,"fast", "", function() {
            $(this).animate({opacity: 1} ,"fast");
        });
    });
});

Моя проблема возникает в Internet Explorer 7 и 6. При анимации с использованием свойств прозрачности вкладки из моего горизонтального меню теряют свои начальные позиции.

Нажмите здесь , чтобы посетить мой веб-сайт. Чтобы увидеть проблему, нажмите " Contato " а затем снова нажмите кнопку «In» # cio ». (извините, он написан на португальском, но вы должны увидеть ошибку). Внимание, до сих пор я обнаружил эту проблему только в IE7 / IE6!

Заранее спасибо!

Это было полезно?

Решение

Я считаю, что это была просто ошибка, связанная с непрозрачностью и Internet Explorer, так как IE не поддерживает непрозрачность. Из документации jQuery jQuery.support.opacity :

  Непрозрачность

: равно true, если браузер   может правильно интерпретировать непрозрачность   свойство style (в настоящее время имеет значение false в   То есть вместо него используются альфа-фильтры).

Чтобы избежать ошибки и по-прежнему влиять на совместимые браузеры, я поместил код анимации в следующее условие:

if ($.support.opacity) {
//animation code
}
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top