2009. 12. 17. 14:34
투명한 iframe 만들기 HTML자스2009. 12. 17. 14:34
|
|
iFrame을 사용해 웹
페이지 중간에 다른 페이지의 내용을 넣을 경우가 있다.
하지만 웹 페이지의 백그라운드 부분에 다른 이미지가 있는 상태에서 iFrame을 넣을 경우 백 그리운드 이미지와 매칭되지 않는 경우가 있는데 이럴 때 투명한 iFrame을 사용하면 된다.
iFrame을 삽입할 페이지에 위와 같이 주고
iFrame에 삽입될 패이지의 body 부분의 스타일을 위와 같이 주면 된다.
또한 iFrame을 투명하게만 주는것이 아니라 반투명 효과를 줄수고 있는데 이는 iFrame의 style을 적용해 주면 된다.
위와 같이 Alpha값의 Opacity값을 변경해 주면 도니다. Opacity값이 낮을수록 투명도가 증가한다.
하지만 웹 페이지의 백그라운드 부분에 다른 이미지가 있는 상태에서 iFrame을 넣을 경우 백 그리운드 이미지와 매칭되지 않는 경우가 있는데 이럴 때 투명한 iFrame을 사용하면 된다.
<iFrame
src="웹페이지 주소" allowTransparency="true" width="가로크기"
height="세로크기>
iFrame을 삽입할 페이지에 위와 같이 주고
<body
style="background:transparent">
iFrame에 삽입될 패이지의 body 부분의 스타일을 위와 같이 주면 된다.
또한 iFrame을 투명하게만 주는것이 아니라 반투명 효과를 줄수고 있는데 이는 iFrame의 style을 적용해 주면 된다.
<iFrame
src="" style="filter:Alpha( Opacity=65 );">
위와 같이 Alpha값의 Opacity값을 변경해 주면 도니다. Opacity값이 낮을수록 투명도가 증가한다.
[출처] [Tip-퍼옴] 투명한 iframe 만들기|작성자 dragonofvaya
