ie6에서 png 이미지 디스플레이

CSS

img

{

background: transparent;-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);/* IE6 & 7 */zoom: 1;

}

.png24{tmp:expression(setPng24(this))}

JavsScript

function setPng24(obj) 

{ 

obj.width=obj.height=1; 

obj.className=obj.className.replace(/\bpng24\b/i,''); 

obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src +"',sizingMethod='image');" 

obj.src=''; 

return ''; 

}

setPng24까지만 쓸경우 다 괜찮은데...

제이쿼리 애니매이션으로 알파값조절하면 익스6은 잘 나오지만 익스8에서 이미지 주변 투명영역 검은색이 되버리는

오류가 있어서 img 마크업에 css를 추가한다.

하지만 저 방법도

제이쿼리로 애니매이션할때 img 요소를 바로 애니매이팅하면 익스8에서 투명영역이 검은색으로 보이는

결과가 나온다. 꼭 img 요소를 다른 요소로 감싸고(span 혹은 li같은) img 요소의 바로 부모요소(감싼 요소)에다가

알파 애니매이팅(페이드인아웃)을 걸어주면 익스8에서도 png 이미지가 깨끗하게 페이드인아웃된다.

익스 6이 잘되는데 익스8이 말썽인 경우는 좀 답답하다..ㅎ