jQuery pngFix — PNG-прозрачность в IE 6 и 5.5

Наверно всем известна проблема некорректного отображения PNG-файлов с прозрачностью в Internet Explorer версии 6 и 5.5. Существует много способов решить эту проблему, но я думаю, что этот способ лучше других подойдет тем, кто использует библиотеку jQuery.

jquery.pngFix — плагин для jQyery, который решает вопрос отображения PNG-файлов с полупрозрачностью в Internet Explorer 6 и 5.5. Вот его основные особенности:

  • маленький размер (всего 2кб в упакованном виде), прост в установке
  • корректно работает с CSS-бэкграундами
  • корректно отображаются PNG-изображения внутри ссылок
  • поддерживаются атрибуты TITLE, ALT, CLASS и STYLE

Использование плагина

1. Скачайте плагин pngFix

2. Подключите необходимые файлы в секции head вашего HTML-фалйа:
<head>
...
<script type="text/javascript" src="jquery-latest.pack.js"></script>
<script type="text/javascript" src="jquery.pngFix.js"></script>
...
</head>
3. Активируйте плагин pngFix в функции document.ready:
<head>
...
<script type="text/javascript">
    $(document).ready(function(){
        $(document).pngFix();
    });
</script>
...
</head>

Вот и все. Можно пользоваться

  2 января 2009  |    jQuery  |    Spider
  jQuery, png, плагин, прозрачность

Комментарии (17)

Ani4o | 21 января 2009, 18:23
А ничё что этому бояну уже 2 года и он с новой версией jquery не пашет ???
Spider | 23 января 2009, 00:37
Ani4o: Если для вас это "боян", то это не означает, что все остальные люди знают про этот плагин. Насчет "новых" версий не знаю, но плагин прекрасно работает с версиями 1.2.x
Serge | 30 января 2009, 09:09
Огромное спасибо.
Inx | 24 июня 2009, 12:59

    Плагин этот неплохой, потому что очень компактный (версия packed около 2,5 Кб), и в большинстве случаев помогает.
 
     Но есть заметный недостаток: безобразно растягивает png-изображения, заданные как background (например, для div).  Убираешь плагин - всё прекрасно.
 
     Пришлось заменить на IE7.js, который намного больше весит (почти 40 Кб), зато ничего не портит...
Петр | 6 августа 2009, 06:51
В старый версиях этого плагина используются регулярные выражения со знаком @ (собака), JQuery уже не использует этот метод. Достаточно удалить @ из плагина (встречается 2 раза) или же загрузить свежую версию плагина, все работает и есть пример: http://plugins.jquery.com/project/pngFix
Spider | 9 августа 2009, 00:07
Петр, большое спасибо! Действительно есть новая версия плагния pngFix для jquery, чтобы заставить Internter Explorer 6 корректно работать с прозрачными png-файлами
karl | 19 августа 2009, 10:55
Все равно в новых даже версиях плагина, в ие6 картинки разносит те, что лежат фоном
 
если для фоновой картинки не нужен repeat, а достаточно no-repeat
то можно в плагине scale заменить на corp
и все работает прекрасно!
Dmitri | 3 декабря 2009, 03:22
У меня в IE 6 нормально все, а вот почему-то в IE 5.5 не хочет работать
Spider | 7 декабря 2009, 15:11
Dmitri, предлагаю Вам "забить" на IE5.5, так как процент людей, который им пользуется, стремится к нулю (если еще не достиг этого значения)
Костя | 16 декабря 2009, 02:07
Ребята, я не могу понять , как это: Активируйте плагин pngFix в функции document.ready: ? Какие файлы из папки pngFix добавлять на сервер?
Spider | 17 декабря 2009, 12:31
Костя, добавляй jquery.pngFix.js (или pngFix.pack.js) и blank.gif
"Активируйте плагин pngFix в функции document.ready" — про это написано в статье. Надо сделать точто так же как там написано — вставить скрипт в HTML-документ. Можно прямо скопировать текст, приведенный здесь.
ALEX | 23 февраля 2010, 21:50
Всё это прекрасно, но как сделать так, что бы всё это работало из PHP. У меня прозрачные картинки (элементы Фона) выдаются скриптом на PHP на который, в свою очередь, ссылается соответствующий класс из CSS, вместо прямой ссылки на картинку в нём.
 
Подскажите пожалуйста, а то я чёт не догоняю  Tears
sys2 | 10 июня 2010, 15:21
Чето все фигово. Фон уехал, ссылки стали неактивные. Хотя в опере, мозиле все ок.
Roman | 15 июля 2010, 11:17
Ну и где заявленный пункт "корректно работает с CSS-бэкграундами"? Растягивает фоновую картинку на весь див. Развод...
некит | 16 апреля 2011, 21:16
Не работает.
Чо за фигня. Уже три способа перепробовал - везьде один и тот же баг. Png в ie6 вообще не отображаются. Хотя раньше почему-то работало. А это может быть из-за того что браузер портативный?
Spider | 19 апреля 2011, 19:50
Может. Все портативные ИЕ, которые я видел, были в чём-то кривыми. У одного не работали поля ввода, у другого что-то ещё... Так что не исключено
Alexey | 17 августа 2011, 02:22
Отлчиный плагин. Очень упрощает жизнь.

Добавить комментарий

Ваше имя: *
Ваш e-mail: * (не публикуется)
Адрес сайта:
Комментарий: *
полужирный курсив курсив курсив вставить ссылку

  

Новости сайта в RSS

Категории

Статьи

Новые Популярные Комментируемые

Облако меток

Разное

Продажа авто Воронеж, покупка авто в Воронеже, авто с пробегом в Воронеже