unitpngfix - Исправление прозрачных png в Internet Explorer до 7 версии

При создании шаблона для этого сайта я использовал много картинок в png с прозрачностью. В FF, Opera, Chrome, Safari - всё выглядит замечательно, но как открыл в ie - ужос! все прозрачные картинки на непонятном сером фоне.

Известное дело, всеми "любимый" браузер microsoft internet explorer 6, 5.5 и более ранних версий не отображает нормально png с прозрачностью.

Для исправления досадного недоразумения следует задать объектам дополнительные свойства, от MS IE (DXImageTransform.Microsoft.AlphaImageLoader и иже с ними). Зачастую, для этого используют jquery.pngFix — плагин для jQuery, который решает вопрос отображения PNG-файлов с полупрозрачностью в Internet Explorer 6 и 5.5.
Первым делом я так и сделал, но как оказалось - jquery.pngFix не исправляет прозрачность png, которые задаются в css свойстве background!

После недолгих поисков нашел подходящий инструмент - Unit PNG Fix!

Что даёт:

  • Очень компактный: меньше 1 кб!
  • Исправляет большую часть проблем, вызванных доп.аттрибутами IE
  • Работает и на объектах img и на аттрибутах background-image, background
  • Запускается автоматически. Не нужно определять классы, чтобы вызвать функции.
  • Поддерживает элементы с auto (автоматической) шириной и высотой.
  • Очень прост в установке.

Использование и установка:

  1. Скачайте архив Unit PNG Fix
  2. Из архива нужно 2 файла: unitpngfix.js(сам скрипт) и clear.gif(прозрачный gif 1x1 пиксель)
  3. Необходимо указать правильный путь к clear.gif в самой первой строке файла скриптаunitpngfix.js, например:
    var clear="/misc/clear.gif" //path to clear.gif
    ...
  4. Закачайте unitpngfix.js и clear.gif на хостинг.
  5. Подключите файл unitpngfix.js в секции head шаблона, например так:
  6. <head>
    ...  
    <!--[if lt IE 7]>
            <script type="text/javascript" src="/js/unitpngfix.js"></script>
    <![endif]-->
    ...  
    </head>

  7. Всё, должно работать.
  8. Если что-то не заработало - проверьте пути к файлам (в шаблоне и в unitfix.js)

Страница проекта


# | лена (?)

анонимус аватар

хочу очень прозрачную понель

2 Сентябрь, 2011 - 12:00

Оставить комментарий

Содержание этого поля является приватным и не предназначено к показу. Если есть аккаунт Gravatar, то отображается глобальный аватар.

Подробнее о форматировании

КАПЧА
А ты не робот? Введи 5 цифр
                                                                 
ad888888b, 8888888888 ad8888ba, 88 ad88888ba
d8" "88 88 8P' "Y8 ,d88 d8" "8b
a8P 88 ____ d8 888888 Y8a a8P
aad8" 88a8PPPP8b, 88,dd888bb, 88 "Y8aaa8P"
""Y8, PP" `8b 88P' `8b 88 ,d8"""8b,
"8b d8 88 d8 88 d8" "8b
Y8, a88 Y8a a8P 88a a8P 88 Y8a a8P
"Y888888P' "Y88888P" "Y88888P" 88 "Y88888P"

Enter the code depicted in ASCII art style.
To prevent automated spam submissions leave this field empty.