jquery png fadeIn fadeOut и чёрная обводка картинок
Несмотря на “корректную” реализацию прозрачности png в IE версии выше 6, при использовании Jquery функций fadeIn, fadeOut (а также fadeTo.. и вообще любых операций с прозрачностью), вокруг прозрачных PNG-изображений создаётся чёрный ореол (чёрная обводка PNG-изображения).
Дело в том, что в IE версий >6 прозрачность реализована также при помощи фильтров
Вариант решения
- создать дополнительный элемент в качестве обёртки для полупрозрачного изображения и уже для него изменять прозрачность - fadeIn|fadeOut
- Задать для элемента-родителя цвет фона
- Если после первых двух пунктов у PNG при изменении прозрачности остаются чёрные артефакты - указать для родителя zoom:1
И да.. ещё для IE вместо fadeIn fadeOut можно использовать show и hide без всяких эффектов
http://forum.jquery.com/topic/transparent-png-shows-black-edges-in-ie8
http://stackoverflow.com/questions/1156985/jquery-cycle-ie7-transparent-png-problem
http://stackoverflow.com/questions/6965845/black-border-around-transparent-png-in-ie8
http://blog.pengoworks.com/index.cfm/2009/2/17/Fading-a-24bit-transparent-PNG-in-IE7
http://www.optimalworks.net/blog/2008/web-development/ie-png-filter-problems/comment-page-1
http://realtech.burningbird.net/graphics/css/opacity-returns-ie8
