воскресенье, 23 ноября 2008 г.

Решение проблемы PNG в IE на чистом CSS

Суть проблемы в том, что IE по крайней мере до версии 6 не понимает полупрозрачность изображений формата PNG. Вобщем, кто сталкивался, тот знает.

Вот мой фикс для проблемы PNG в Internet Explorer на чистом CSS

CSS:


/* -- PNG Fix for IE 6 -- */
#rssfeed {
cursor: pointer;
background: none;
/* фильтр применим к IE5+/Win */
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true', sizingMethod='fixed', src='http://lh4.ggpht.com/_3_wwcvitlLc/SSmteux8LcI/AAAAAAAAAgM/ihNYB3mcNO8/feed-icon-red.png');
}
#rssfeed[id] {
/* [id] применим для нормальных браузеров (не IE) */
background: url(http://lh4.ggpht.com/_3_wwcvitlLc/SSmteux8LcI/AAAAAAAAAgM/ihNYB3mcNO8/feed-icon-red.png) no-repeat;
}
* html #rssfeed a {
/* сделать ссылки интерактивными в IE */
position: relative;
z-index: 999;
}

HTML:


<div id="rssfeed"></div>

Этот прием у меня сработал.

Почему-то многие рекомендуют способ от Komodomedia - CSS PNG Image Fix for IE. Наверное потому, что никто не применял :). У меня их способ не сработал.
Ну и вот еще ссылка на подборочку фиксов для PNG в IE: CSS Hackz Series: PNG Fix for Internet Explorer.

5 Комментариев :

ignar комментирует...

Меня заинтересовал Ваш блог, давайте дружить :) предлагаю сотрудничество.

Пишу сюда, так как не нашел контакты.

Croaker комментирует...

Без проблем :)

Анонимный комментирует...

у меня не работает. бред какой-то...

Croaker комментирует...

У меня красная иконка RSS в правом верхнем углу экрана сделана как раз с использованием этого фикса. Так что все работает.

Анонимный комментирует...

Все работает, спасибо!

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

Жги!