ie8 투명 png 에서 opacity 적용해서 전환 효과시 버그 해결방법

 

 

출처 : http://sqlplus.tistory.com/417

http://gnitfos.blog.me/140176618954

var i;
for (i in document.images) {
    if (document.images[i].src) {
        var imgSrc = document.images[i].src;
        if (imgSrc.substr(imgSrc.length-4) === '.png' || imgSrc.substr(imgSrc.length-4) === '.PNG') {
            document.images[i].style.filter ="progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + imgSrc + "')";
        }
    }
}

위 글을 참고로 해서

해당 png 이미지가 있는 tag를

<img src="이미지.png"

style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='이미지.png')" />

와 같이 수정했더니 투명과 투명이 아닌부분 경계선이 지저분해 보이는 현상이 사라졌다.