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 ,d8 ad8888ba, 8888888888 888888888888
,d88 ,d888 8P' "Y8 88 ,8P'
888888 ,d8" 88 d8 88 ____ d8"
88 ,d8" 88 88,dd888bb, 88a8PPPP8b, ,8P'
88 ,d8" 88 88P' `8b PP" `8b d8"
88 8888888888888 88 d8 d8 ,8P'
88 88 88a a8P Y8a a8P d8"
88 88 "Y88888P" "Y88888P" 8P'

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