[javascript] IE6 웹에서 png 투명파일 출력하기
로빈아빠
본문
Internet Explorer 7부터는 알파 PNG 이미지를 지원하기때문에 상관이 없지만 대다수가 아직 Internet Explorer 6 버전을 사용하고 있기에 종종 부자연스러운 이미지를 발견할 수 있다. 스크립트와 CSS를 이용하여 알파 PNG 이미지의 투명도를 설정할 수 있다. (ex.이미지의 클래스는 png24로 지정한다.)
다음과 같이 CSS를 정의한 후에 png 이미지의 클레스를 지정해 주면 png 파일도 웹에서 출력할 수 있다.
<script language="javascript">
function setPng24(obj) {
var request_os = window.navigator.userAgent;
var os_array = request_os.split(";");
if(os_array[1] != " MSIE 7.0") {
obj.width=obj.height=1;
obj.className=obj.className.replace(/png24/i,'');
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src +"',sizingMethod='image');";
obj.src='';
}
return '';
}
</script>
<style type="text/css">
.png24 {tmp:expression(setPng24(this));}
</style>
<img src="a.png" class="png24" />
다음과 같이 CSS를 정의한 후에 png 이미지의 클레스를 지정해 주면 png 파일도 웹에서 출력할 수 있다.
<script language="javascript">
function setPng24(obj) {
var request_os = window.navigator.userAgent;
var os_array = request_os.split(";");
if(os_array[1] != " MSIE 7.0") {
obj.width=obj.height=1;
obj.className=obj.className.replace(/png24/i,'');
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+ obj.src +"',sizingMethod='image');";
obj.src='';
}
return '';
}
</script>
<style type="text/css">
.png24 {tmp:expression(setPng24(this));}
</style>
<img src="a.png" class="png24" />
관련링크
댓글목록
등록된 댓글이 없습니다.