Все, наверное, знают, что png с прозрачным задним фоном некорректно отображается в
IE а именно вместо прозрачного заднего фона фон имеет серый оттенок. Сегодня мы покажем как просто можно решить эту проблему .
1. создаём png.css с содержимым:.iePNG, IMG { filter:expression(fixPNG(this)); }.iePNG A { position: relative; }
2. создаём pngie.js с содержимым:function fixPNG(element){ if (/MSIE (6).+Win/.test(navigator.userAgent)) { var src; if (element.tagName=='IMG') { if (/.png$/.test(element.src)) { src = element.src; element.src = "images/blank.gif"; } } else { src = element.currentStyle.backgroundImage.match(/url("(.+.png)")/i) if (src) { src = src[1]; element.runtimeStyle.backgroundImage="none"; } } if (src) element.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod='none')"; }}
Заметьте что строка
element.src = "images/blank.gif";
это путь к вашей 1пиксельной картинке которую вы должны залить к себе на хост и указать правильный путь.
3. Теперь подключаем css и js. В сквозной файл сайта (как правило это index.php или header.php) ставя условие чтобы данный css и js работали только в IE6:
<!--[if lte IE 6]><script type="text/javascript" src="pngie.js"></script><link rel="stylesheet" type="text/css" href="/css/png.css" /><![endif]-->
Всё теперь в
IE6 будет включаться
JS из которого будет браться пиксельная картинка.
gif и указать браузеру задний фон
png.
Отзывы