이하의 예제는 윈도우XP WEB 형식의 바탕화면에 맞추어 제작하였습니다.
■ BrickInside DB 출력
<div id="wrap" style="position:absolute; top:-655px; left:-15px;">
<iframe src="http://www.brickinside.com" width="122" height="673" scrolling="no" frameborder="0"></iframe>
</div>
<iframe src="http://www.brickinside.com" width="122" height="673" scrolling="no" frameborder="0"></iframe>
</div>
■ KWeather 출력 (오늘날씨, 내일날씨)
파일1번
<div style="position:absolute; top:-800px; left:-35px;">
<iframe src="http://www.kweather.co.kr/main/index.htm" width="360" height="874" scrolling="no" frameborder="0"></iframe>
</div>
파일2번
<div style="position:absolute; top:-655px; left:-200px;">
<iframe src="http://www.kweather.co.kr/main/index.htm" width="360" height="729" scrolling="no" frameborder="0"></iframe>
</div>
<div style="position:absolute; top:-800px; left:-35px;">
<iframe src="http://www.kweather.co.kr/main/index.htm" width="360" height="874" scrolling="no" frameborder="0"></iframe>
</div>
파일2번
<div style="position:absolute; top:-655px; left:-200px;">
<iframe src="http://www.kweather.co.kr/main/index.htm" width="360" height="729" scrolling="no" frameborder="0"></iframe>
</div>
이하 문서의 출처 : http://ekorea.tistory.com/1067
아이프레임을 2개 중첩하면 만들수 있더랍니다.
갖어올 파일과, 표시할 파일이 필요하구요.
가져올파일 소스를 아래와 같이 합니다.
예) piece.html
---------------------------------------------------------
<div id="wrap" style="position:absolute; top:-세로시작값px; left:-가로시작값px;">
<iframe src="가져올주소" width="1000" height="1000" scrolling="no" frameborder="0"></iframe>
</div>
---------------------------------------------------------
가로시작값이나, 세로 시작값은 페이지 출력이 시작되는 좌표 입니다.
표시할 파일 소스는 아래와 같이 합니다.
---------------------------------------------------------
<iframe src="piece.html" width="가로크기" height="세로크기" frameborder="0" scrolling="no"></iframe>
---------------------------------------------------------
원리나 방법은 무척이나 간편하죠?
단점은 출력되는 좌표값을 알아내는게 어려울 뿐입니다.
곰곰히 생각하니 갖어올 페이지를 일일이 만들어야 되는것도 귀찮구요.
그래서 위치 에디터와 갖어올 파일을 생성하는 소스도 만들어 봤습니다.
각종 폼 값을 입력 후 Piece Size에서,
클릭으로 가로와, 세로 위치를, Shift+클릭으로 크기를 지정하면 소스를 만들어 줍니다.
에디터 미리보기 : http://qurx.net/_tools/wp/editor.html
소스 받기 : http://qurx.net/_tools/wp.zip
생성기(index.html)는 주소에 옵션을 입력하는 방식입니다
이 옵션을 에디터에 그대로 대입하면 옵션 그대로 수정할 수 있습니다.
예) u=주소&y=가로시작값x=세로시작값
에디터 지원 옵션------------------------------------------
u : 주소
y : 가로시작값
x : 세로시작값
w : 가로크기
h : 세로크기
l : 링크옵션 [기본 0](1/링크방지, 2/원본사이트, URL/특정주소)
c : 배경색
에디터 미 지원 옵션---------------------------------------
ffx : 파이어폭스 세로 값
ffy : 파이어폭스 가로 값
opx : 오페라 세로값
opy : 오페라 가로값
r : 가져오는 페이지 해상도 [기본 1000,1000](가로,세로)
p : 링크시 타겟 [기본 parent]
---------------------------------------------------------
문제점이 있다면
1 . 로딩 후 특정 폼으로 이동하는 페이지의 경우 위치가 틀어집니다.
2 . 브라우저마다 위치가 다를 수 있습니다(ffx, ffy, opx, opy 사용으로 해결!)
사이트의 소스를 재가공하는 방식이 아니기에 저작권에 문제는 없을 듯 합니다만,
원본페이지의 운영자가 거부하는 경우 될수 있으면 사용하면 안되겠죠?