Прозрачность картинок png, gif. Проблемы с IE6.

Прозрачность картинок png, gif. Проблемы с IE6. что делать если нужно использовать прозрачную картинку в дизайне? Explorer не поддерживает png-формат.

gif-прозрачность однотонна. Хочется использовать png формат, который поддерживает более умную прозрачность, но, весит побольше gif'а. Да ещё и возникает проблема: IE6, как и IE5, png-формат не поддерживают.

Что же делать?

1. Тупо забить. Сейчас мало кто использует IE6, и не стоит оно, чтобы об этом заботиться... Лучше подумать о любимой.

2. Решить проблему. У меня до сих пор, например, IE6, которым я пользуюсь крайне редко.

И вот решение: с помощью java script (jquery) - см. здесь: andreaseberhard.de.

Чтобы png-фон стал прозрачным, заливаем себе 2 файла:

jquery-latest.pack.js (или другой jquery поновее);

jquery.pngFix.js.

Прописываем в путь к этим файлам.

<head>
...
<script type="text/javascript" src="jquery-latest.pack.js"></script>

<script type="text/javascript" src="jquery.pngFix.js"></script>
...
</head>

И активируем тоже в .

<head> 
...
<script type=“text/javascript”> 
    $(document).ready(function(){ 
        $(document).pngFix(); 
    }); 
</script> 

… 
</head>

И все. Теперь png-image прозрачный в IE6 и в IE 5.5.

3. Другой способ - это flash. В swf-файле с прозрачным фоном, при настройке его публикации можно задать любой размер без потери качества, в отличие от png. Весит он мало, грузится быстро и с прозрачным фоном. А то, что не у всех в браузере включен flash, решается картинкой-заглушкой.  Как раз тот прозрачный gif или png на крайний случай для тех, его усидят те, у кого не загрузится флешка.

В код вставки swf-файла в html прописываем прозрачный фон (wmode) и заглушку (img).

<object type=”application/x-shockwave-flash” data=”images/loco.swf” width=”425″ height=”368″>
   <param name=”wmode” value=”transparent” />

   <param name=”movie” value=”images/loco.swf” />
   <img src=”images/loco.png” width=”425″ height=”368″ alt=”" />
</object>
Источник: loco.ru

almix
Разработчик Loco, автор статей по веб-разработке на Yii, CodeIgniter, MODx и прочих инструментах. Создатель Team Sense.

Вы можете почитать все статьи от almix'а.




Комментарии (0)     Подпишитесь на RSS комментариев к этой статье.