아이프레임 밖에서 아이프레임 안으로 링크걸기

 

오른쪽에 아이프레임 위에 보이는 링크(문서 1 2 3)를 각각 클릭해보세요.
아이프레임 태그 안에 이름을 붙여주고, 아이프레임 밖에서 일반문서링크하는 것처럼 아이프레임에 붙여준 이름을 타겟으로 설정하면 아이프레임 내부로 링크가 됩니다.

지금 보고 계신 본페이지는 문서는 kissbase.html ,
아이프레임 안에 처음 보여지는 문서는 kissiframe1.html 이라는 가정 하에 아래처럼 해주시면 됩니다.

1. kissbase.html 안에 kissiframe1.html 을 아이프레임으로 넣습니다.

 

<iframe src="kissiframe1.html" name="kissgod01" ></iframe>

kissbase.html 문서 안에 kissiframe1.html 이라는 문서를 아이프레임으로 넣고, kissiframe1.html 이 들어가는 아이프레임 틀 안에 ( name="kissgod01" 을 추가함으로써) kissgod01 이라는 이름을 붙였습니다.

2. 다음에는 본문서 kissbase.html 에서 아이프레임 안으로 링크를 겁니다.

<a href="kissiframe1.htm" target="kissgod01">처음</a>
<a href="문서1.html" target="kissgod01">문서1</a>
<a href="문서2.html" target="kissgod01">문서2</a>
<a href="문서3.html" target="kissgod01">문서3</a>

문서1 2 3 을 각각 클릭하면, kissgod01 이라는 이름이 붙어 있는 아이프레임 안(여기서는 kissiframe.html 이 들어간 아이프레임)에 링크걸린 문서가 각각 뜹니다

한 페이지 안에 여러개의 아이프레임을 넣고, 아이프레임에 각각 다른 이름을 붙여준다면 위처럼 할 수도 있겠지요. 지금 보고 계신 본페이지 문서는 kissbase.html , 예제에 보이는 두 개의 아이프레임에 기본으로 들어가는 문서는 kissiframe1.html 과 kissiframe2.html 라는 가정 하에 아래처럼 해주시면 됩니다.

1. kissbase.html 안에 아래와 같은 방법으로 kissiframe1.html 과 kissiframe1.html 를 아이프레임으로 넣습니다.

 

<iframe src="kissiframe1.html" name="kissgod01" ></iframe>
<iframe src="kissiframe2.html" name="kissgod02" ></iframe>

2. 다음에는 본문서 kissbase.html 에서 원하는 아이프레임을 타겟 지정후 링크합니다.

<a href="kissiframe1.htm" target="kissgod01">처음</a>
<a href="문서1.html" target="kissgod01">문서1</a>
<a href="문서2.html" target="kissgod01">문서2</a>
<a href="문서3.html" target="kissgod01">문서3</a>

<a href="kissiframe2.htm" target="kissgod02">처음</a>
<a href="문서4.html" target="kissgod02">문서4</a>
<a href="문서5.html" target="kissgod02">문서5</a>
<a href="문서6.html" target="kissgod02">문서6</a>