Ошибка сглаживания шрифтов в Webkit, когда iframe с Flash находится на странице. Есть ли обходной путь?
Я столкнулся с неприятной ошибкой в Chrome и Safari на Mac. Похоже, что это связано со сглаживанием шрифтов и наличием у страницы фрейма со встроенным Flash.
Когда я удаляю iframe, текст выглядит так, как будто font-smoothing: subpixel-antialiased
(браузер по умолчанию). Но когда iframe находится на странице (с запущенным внутри нее Flash), кажется, текст установлен font-smoothing: antialiased
,
Есть ли обходной путь для этого? Пожалуйста, смотрите скриншоты ниже.
2 ответа
Я думаю, что нашел "хорошо" решение. У меня был div, который слегка перекрывал iframe, внутри которого был Flash. В этом перекрывающемся элементе сглаживается шрифт. Чтобы это исправить, мне просто нужно было поместить z-index как в iframe, так и в перекрывающийся div. Чтобы это работало, iframe должен быть сверху div (более высокий z-индекс). В приведенном выше примере не видно, что что-то перекрывает iframe, но граница каждого элемента может слегка перекрываться. Вы сможете увидеть это с помощью веб-инспектора в Safari или Chrome. Но я бы просто начал, добавив z-index в iframe и элементы, которые испортили сглаживание шрифтов.
У меня тоже была эта проблема, и я решил ее так:
.video1 { position: relative; height: 338px; width: 100%; }
.video1 > div { position: absolute; }
Затем я поместил iFrame во второй div. Теперь, когда iFrame находится в абсолютно позиционированном элементе div, он больше не вызывает сглаживания текста на странице при загрузке страницы в Safari.