Каждый уважающий себя веб-дизайнер сталкивался с проблемой прозрачных PNG в Internet Explorer 6. Да да, эта головная боль не давала спокойной жизни многим верстальщикам, мне в том числе. Осознавая проблему, приходилось рисовать макеты упрощенные, чтобы резать можно было под ИЕ6 (то есть опираясь на браузер 9 летней давности), либо уже идти ва-банк и отрезать “доблестному старичку” вход на сайт этим самом лишиться некоторое число посетителей, а в некоторых случаях и потенциальных пользователей. Вот сейчас я столкнулся с такой же проблемой, верстая сайт из своего же макет, уже пришел к решению, что ИЕ6 надо “забанить”, однако, случайно наткнулся на один чудо-скрипт который решил проблему прозрачности. О нем мы и поговорим дальше.
Скрипт DD_belatedPNG, который можно скачать отсюда, в отличии от своих конкурентов, мною исследованных, сохраняет активные элементы активными после обработки, и настройка функции достаточно проста:
<script type="text/javascript"> |
Как видно из данной функции обрабатываемые объекты, задаются через запятую, и можно вписывать как CSS селекторы, так и обычные HTML тэги.
В конечном счете наш “фикс” PNG прозрачности должен выглядеть так:
<!--[if IE 6]> <script src="DD_belatedPNG.js"></script> |
Для сравнения приведу примеры:
До | После |