Семейство шрифтов плохо отображается в Explorer с анимацией jQuery - PullRequest
Новая
       26

Семейство шрифтов плохо отображается в Explorer с анимацией jQuery

0 голосов
/ 26 марта 2011

Я использую это в моем CSS ... 

.myclass { font-size: 16px; font-style: italic; font-family: Georgia, "Times New Roman", Times, serif; }

Он выглядит хорошо и плавно во всех браузерах, кроме Explorer. (Я тестировал только в IE8 на XP SP2)

В Explorer это выглядит ужасно! Нет сглаживания шрифтов вообще.

Однако это проблема только для блоков DIV, которые начинаются с «display: none;» и раскрываются с помощью jQuery ... 

<html>
    <div id="messageBox" style="display:none;">
        <div id="message" class="myClass"></div>
    </div>
</html>

<script>
    function message(msg) {
        $("#messageBox").slideDown('slow');
        $("#message").html(msg).animate({opacity: 1},500);
    };
</script>

Когда я помещаю рядом с ним дублированный DIV, содержащий тот же контент в том же стиле, шрифт отображается идеально. Только когда я использую анимацию jQuery, чтобы сдвинуть ее вниз и показать, что она остается неровной и безобразной.

Есть ли лучший способ для меня сделать это? Возможно, в мою семью следует добавить другой шрифт с засечками, который будет правильно отображаться во всех браузерах, включая Explorer.

Спасибо вам!

1 Ответ

1 голос
/ 26 марта 2011

Да, проблема в непрозрачности. IE делает opacity непонятным с помощью dxfilters, и при этом отключает сглаживание шрифтов.

Вы могли бы исправить это, выполнив следующее: 

$("#message").html(msg).animate({opacity: 1},500, function()
{
    $(this).css('opacity', '');
});

Например, после завершения анимации сбросьте правило css непрозрачности и надейтесь, что IE сбрасывает рендеринг по умолчанию. Если это не сработает, попробуйте заменить весь div новой копией, для которой не установлена ​​прозрачность.

...