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 цифр
                                                            
88 ad8888ba, ad88888ba ad88888ba 88
,d88 8P' "Y8 d8" "88 d8" "88 ,d88
888888 d8 8P 88 8P 88 888888
88 88,dd888bb, Y8, ,d88 Y8, ,d88 88
88 88P' `8b "PPPPPP"88 "PPPPPP"88 88
88 88 d8 8P 8P 88
88 88a a8P 8b, a8P 8b, a8P 88
88 "Y88888P" `"Y8888P' `"Y8888P' 88

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