분류 전체보기 (199)
ººº::Development™:: (66)
ººº::Learning™:: (31)
ººº::Information™:: (37)
ººº::Note™:: (11)
ººº::Photo™:: (50)
ººº::zEtc™:: (3)
rss

믹시
tistory 티스토리 가입하기!
2007. 4. 4. 13:11
투명한 iFrame 만들기

iFrame을 사용해 웹 페이지 중간에 다른 페이지의 내용을 넣을 경우가 있다.
하지만 웹 페이지의 백그라운드 부분에 다른 이미지가 있는 상태에서 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값이 낮을수록 투명도가 증가한다.