'iframe'에 해당되는 글 1건
2007. 4. 4. 13:11
투명한 iFrame 만들기
iFrame을 사용해 웹 페이지 중간에 다른 페이지의 내용을 넣을 경우가 있다.
하지만 웹 페이지의 백그라운드 부분에 다른 이미지가 있는 상태에서 iFrame을 넣을 경우 백 그리운드 이미지와 매칭되지 않는 경우가 있는데 이럴 때 투명한 iFrame을 사용하면 된다.
iFrame을 삽입할 페이지에 위와 같이 주고
iFrame에 삽입될 패이지의 body 부분의 스타일을 위와 같이 주면 된다.
또한 iFrame을 투명하게만 주는것이 아니라 반투명 효과를 줄수고 있는데 이는 iFrame의 style을 적용해 주면 된다.
위와 같이 Alpha값의 Opacity값을 변경해 주면 도니다. Opacity값이 낮을수록 투명도가 증가한다.
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값이 낮을수록 투명도가 증가한다.
'ººº::Development™:: > ::WEB™::' 카테고리의 다른 글
| [Javascript] 실수 소수점 처리 - 반올림, 버림 (0) | 2009.10.01 |
|---|---|
| [PHP] 내림 / 올림 / 반올림 함수 (0) | 2009.07.09 |
| [CSS] 메뉴를 손쉽게 꾸며보자 (0) | 2008.09.23 |
| [Javascript] Dragtable - Table정렬 스크립트.. (0) | 2008.07.16 |
| [JavaScript] Giva Labs이 만든 콤보박스 (0) | 2008.07.09 |
