【黑邊】IE下PNG透明圖檔fadeIn出現黑邊的問題

工作上有需求，做網站首頁的幻燈。

圖檔使用的是PNG32透明圖檔，效果使用了jQuery的fadeIn & fadeOut

fadeIn Out是使用改變opacity的值來達到淡入淡出的效果。

但是這種效果在IE下這種對PNG支援存在問題的浏覽器下，在淡入淡出的瞬間，圖檔内容的邊緣就會出現一塊黑色的區域。

特别的難看。

經過搜尋和嘗試最終得到解決方案。

首先，由于之前大圖使用的是IMG标簽，先改成把圖檔當成DIV的背景圖。

設定好DIV的高寬，然後設定inline-style

style='background:url(your.png);background:none\0;*background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="your.png", sizingMethod="crop");'      

主要是要将ie6-8的background設定成none;

background:none\0;  為ie8的hack。

*background:none;   為ie6的hack。

然後使用濾鏡，就可以搞定了。

//=====================================================

另外，還有其他的解決方法：

給心靈一個純淨空間，讓思想，情感，飛揚！