Web

iframe 속성

좋은느낌/원철 2008. 10. 15. 13:04
출처 : http://kr.blog.yahoo.com/junetee97/86.html?p=1
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
속성 설명
src=notice.cgi 프레임 내에 삽입할 파일의 이름 또는 주소를 표시한다.
name=cginjs 프레임 내에 이름을 지정. (링크시 target 지정할때)
align=center left(왼쪽), center(중앙), right(오른쪽)정렬을 한다.
border=1 테두리의 두께가 숫자만큼 두꺼워진다.
bordercolor=red 테두리의 색생을 바꾼다.
frameborder=1 or 0

창의 경계선(두께)의 지정시
1 이면 경계선이 나타나고
0 이면 경계선이 없어진다.

framespacing=1 인접한 창들의 간격
height=200 iframe의 창의 높이(세로크기)를 조절한다.
width=500 iframe의 창의 너비(가로크기)를 조절한다.
marginheight=0 iframe 내부의 창의 상하 여백
marginwidth=0 iframe 내부의 좌우 여백을 나타낸다.
topmargin=0 상단의 공백
scrolling=yes 스크롤바의 유무를 나타낸다.yes or no or auto
noresize 창의 크기를 고정시킨다.
투명 IFRAME 만들기 ALLOWTRANSPARENCY="true" 그리고
IFRAME 태그의 src에 할당된 html 파일 내부의 BODY 태그에 
style="background-color:transparent" 삽입 
(IE 5.5 이상 및 넷스케이프 6 이상가능)


 ≫ IFrame 사용법 

　

아래와 같은 방식으로 하시면 공지사항을 메인페이지 안에 삽입시킬 수 있습니다.

<iframe src=http://img.yahoo.co.kr/blank.gif name='cginjs' width='410' height='130' marginwidth='0' marginheight='0' topmargin='0' scrolling='no' frameborder='0' ></iframe> 

삽입 시키는 페이지에 따라 크기가 틀리기 때문에 위의 속성표를 보시고 크기라든가 스크롤 여부는 여러분에 환경에 알맞게 조정하시면 됩니다.

속이 훤히 들여다 보이는 투명 IFRAME 만들기 (IE 5.5 이상 및 넷스케이프 6 이상가능)

<iframe src=http://img.yahoo.co.kr/blank.gif name='cginjs' width='410' height='130' ALLOWTRANSPARENCY="true"></iframe> 

IFRAME 삽입할 페이지인 test.html의 body에 <body style="background-color:transparent">를 넣어 주면 됩니다.

IFRAME에 투명 스크롤바 적용하기

IFRAME에 삽입할 페이지에 투명스크롤바 태그를 적용해주면 됩니다.
<iframe src=http://img.yahoo.co.kr/blank.gif name='cginjs' width='410' height='130' ></iframe> 

IFRAME 삽입할 페이지인 test.html의 아래와 같이 입력해주면 됩니다.

<style>
body {
scrollbar-face-color: #FFFFFF; 
scrollbar-shadow-color: #90a0e0; 
scrollbar-highlight-color: #F6F8FD; 
scrollbar-3dlight-color: #FFFFFF; 
scrollbar-darkshadow-color: #FFFFFF; 
scrollbar-track-color:#FFFFFF;
scrollbar-arrow-color: #90a0e0;
}
</style>

투명스크롤바 태그는 옆메뉴에 폼태그 갤러리를 이용하거나 C.n.J 마법사를 이용하면 됩니다. 

IFRAME에서 부모창에 링크 걸기(IFRAME ==> 일반프레임)

1. 자바스크립트로 IFRAME에서 부모창 프레임에 링크 걸때
<a href="　javascript　:;" onclick="parent.parent.프레임명.location.href='페이지'";>프레임에 링크걸기</a>
2. 일반링크로 IFRAME에서 부모창 프레임에 링크 걸때
<a href="페이지" target="프레임명">프레임에 링크걸기</a> 

부모창에서 IFRAME에 링크 걸기(일반프레임 ==> IFRAME)

1. 자바스크립트로 부모창에서 IFRAME에 링크 걸때
<a href="　javascript　:;" onclick="parent.아이프레임이 속한 부모창 프레임명.아이프레임명.location.href='페이지'";>아이프레임에 링크걸기</a>
예제 클릭 : <a href="　javascript　:;" onclick="parent.cginjs_com_main.iframe01.location.href='http://www.google.co.kr'">
2. 부모창에서 IFRAME에 링크 걸때
<a href="페이지" target="아이프레임명">아이프레임에 링크걸기</a> 
예제 클릭 : <a href="http://www.google.co.kr" target="iframe01">
3. 부모창에 폼 값을 IFRAME 폼 필드 값 넘기기
방법 : document.아이프레임네임.document.아이프레임내의 폼네임.아이프레임폼필드.value = document.부모창 폼네임.부모창 폼필드명.value;
폼 테스트 :  　

IFRAME에 특정 프레임에 자바스크립트 함수 불러오기

IFRAME에 특정 프레임에 자바스크립트 함수 불러오기
<a href="　javascript　:parent.parent.프레임명.자바스크립트 함수()">자바스크립트 함수 불러오기</a>

IFRAME에 자바스크립트 함수 불러오기(프레임없을때)
<a href="　javascript　:parent.top.자바스크립트 함수()">자바스크립트 함수 불러오기</a>