Главная » Блоги » блог teerex

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

3 Май, 2009 - 17:17, teerex

При создании шаблона для этого сайта я использовал много картинок в 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>

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

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

Метки:

# | лена (?)

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

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

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

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

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

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

КАПЧА
А ты не робот? Введи 5 цифр
                                                                 
  ad88888ba        88    ad88888ba     ad88888ba      ad8888ba,  
 d8"     "88     ,d88   d8"     "88   d8"     "88    8P'    "Y8  
 8P       88   888888   8P       88   8P       88   d8           
 Y8,    ,d88       88   Y8,    ,d88   Y8,    ,d88   88,dd888bb,  
  "PPPPPP"88       88    "PPPPPP"88    "PPPPPP"88   88P'    `8b  
          8P       88            8P            8P   88       d8  
 8b,    a8P        88   8b,    a8P    8b,    a8P    88a     a8P  
 `"Y8888P'         88   `"Y8888P'     `"Y8888P'      "Y88888P"
Enter the code depicted in ASCII art style.
To prevent automated spam submissions leave this field empty.