Главная » 2010 » Июль » 8 » Альфа-канал (прозрачность) в Internet Explorer (Javascript)
08.07.2010, 11:35

Альфа-канал (прозрачность) в Internet Explorer



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

Известное дело, всеми "любимый" браузер 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, например:

Code
var clear="/misc/clear.gif" //path to clear.gif

4. Закачайте unitpngfix.js и clear.gif на сайт.
5. Подключите файл unitpngfix.js в секции head шаблона:

Code
<!--[if lt IE 7]>
  <script type="text/javascript" src="ПУТЬ ДО СКРИПТА unitpngfix.js"></script>
  <![endif]-->

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

Материал взят с сайта infoscript.ru
Теги: Скачать Альфа-канал (прозрачность) в Internet Explorer
Скачать "Альфа-канал (прозрачность) в Internet Explorer"
Внимание! Копирование данного материала запрещено без указания ссылки на сайт Infoscript.ru
Источник/Автор: http://labs.unitinteractive.com/
Категория: JavaScript's | Просмотров: 2255 | Добавил: 7soft | Рейтинг: 4.5/2 |
Теги: Internet, (прозрачность), альфа-канал, EXPLORER
Пока комментариев нет. Ты можешь быть первым!
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]