'투명'에 해당되는 글 1건

  1. 2013.01.08 익스플로어 6에서 png파일 투명하게 보이기
728x90

알고 계신 분들이 많겠지만 혹여 모르시는 분들을 위해 알려드립니다.

익스플로어6에서 지원하지 않는 png파일을 투명하게 보이게 할겁니다.

1. 배경화면에 png파일 구현

#header {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='이미지이름.png', sizingMethod='crop');
}

#contents {
background:none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='이미지이름.png', sizingMethod='crop');
}

이렇게 속성을 적어주면 IE6에서도 작동되는걸 확인하실 수 있습니다.

2. 이미지형식의 png파일 구현

자바스크립트를 하나 추가하고 이미지에 클래스를 지정해 주면됩니다.
<script type="text/javascript">
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 '';
}
</script>

html 소스
<img src="이미지이름.png" alt="png이미지" class="png24" />

IE6 전용 css
.png24 {tmp:expression(setPng24(this));}

 

출처: 네이버 블로그

주소: http://baraem2005.blog.me/20169490375

 

728x90

'CSS' 카테고리의 다른 글

clearfix  (0) 2013.10.01
clear  (0) 2013.01.25
CSS 스타일시트 속성정리  (0) 2013.01.08
CSS레이아웃-플로트를 이용한 2단 레이아웃  (0) 2013.01.08
CSS 레이아웃-중간 정렬하기  (0) 2013.01.08
Posted by 정망스
,


맨 위로
홈으로 ▲위로 ▼아래로 ♥댓글쓰기 새로고침