웹마스터 팁
다른 도메인간 iframe 크기 자동조절(cross domain iframe auto resize)
2008.04.24 13:21
참고하세요...
a.com이라는 도메인에서 b.com의 b.html을 불러올때.. 크기를 자동으로 조절하기 위한 방법입니다.
먼저 a라는 홈페이지에 auto_size.html을 만듭니다.
====================== auto_size.html - a.com =========================
<html>
<head>
<title>Resizing Page</title>
<script type="text/javascript">
function onLoad() {
var params = window.location.search.substring( 1 ).split( '&' );
var height;
for( var i = 0, l = params.length; i < l; ++i ) {
var parts = params[i].split( '=' );
switch( parts[0] ) {
case 'height':
height = parseInt( parts[1] );
break;
}
}
if( typeof( height ) == 'number' ) {
window.top.updateIFrame( height );
}
}
window.onload = onLoad;
</script>
</head>
<body>
<p>Resizing IFrame...</p>
</body>
</html>
=======================================================
그리고 a라는 홈페이지에서 링크할 문서에는 아래와 같이 삽입합니다.
======================= a.html - a.com ===================
<script type="text/javascript">
function updateIFrame( height ) {
var iframe = document.getElementById( 'myiframe' );
iframe.setAttribute( '+ 'height', height );
}
</script>
<iframe id="myiframe" src="http://b.com/b.html" scrolling=no frameborder=0 width="600" height="600"></iframe>
이제 b라는 도메인의 b.html에는 아래와 같이 삽입합니다.
================== b.html - b.com============================
<style>
#inneriframe { position : absolute; top : 0px; left : 0px; visibility: hidden; }
</style>
<script type="text/javascript">
function rsize() {
var iframe = document.getElementById( 'inneriframe' );
var wrapper = document.getElementById( 'wrapper' );
var height = Math.max( document.body.offsetHeight, document.body.scrollHeight );
iframe.src = 'http://a.com/auto_size.html?height='+height; }
</script>
<body onload=rsize(); >
<div id=wrapper>
내용
</div>
<iframe id="inneriframe" width="10" height="10"></iframe>
</body>
a.com이라는 도메인에서 b.com의 b.html을 불러올때.. 크기를 자동으로 조절하기 위한 방법입니다.
먼저 a라는 홈페이지에 auto_size.html을 만듭니다.
====================== auto_size.html - a.com =========================
<html>
<head>
<title>Resizing Page</title>
<script type="text/javascript">
function onLoad() {
var params = window.location.search.substring( 1 ).split( '&' );
var height;
for( var i = 0, l = params.length; i < l; ++i ) {
var parts = params[i].split( '=' );
switch( parts[0] ) {
case 'height':
height = parseInt( parts[1] );
break;
}
}
if( typeof( height ) == 'number' ) {
window.top.updateIFrame( height );
}
}
window.onload = onLoad;
</script>
</head>
<body>
<p>Resizing IFrame...</p>
</body>
</html>
=======================================================
그리고 a라는 홈페이지에서 링크할 문서에는 아래와 같이 삽입합니다.
======================= a.html - a.com ===================
<script type="text/javascript">
function updateIFrame( height ) {
var iframe = document.getElementById( 'myiframe' );
iframe.setAttribute( '+ 'height', height );
}
</script>
<iframe id="myiframe" src="http://b.com/b.html" scrolling=no frameborder=0 width="600" height="600"></iframe>
이제 b라는 도메인의 b.html에는 아래와 같이 삽입합니다.
================== b.html - b.com============================
<style>
#inneriframe { position : absolute; top : 0px; left : 0px; visibility: hidden; }
</style>
<script type="text/javascript">
function rsize() {
var iframe = document.getElementById( 'inneriframe' );
var wrapper = document.getElementById( 'wrapper' );
var height = Math.max( document.body.offsetHeight, document.body.scrollHeight );
iframe.src = 'http://a.com/auto_size.html?height='+height; }
</script>
<body onload=rsize(); >
<div id=wrapper>
내용
</div>
<iframe id="inneriframe" width="10" height="10"></iframe>
</body>
댓글 2
| 제목 | 글쓴이 | 날짜 |
|---|---|---|
| 제로보드로 유료 사이트 만들기 (결제 테이블) [2] | 한꼬마 | 2002.10.30 |
| 제로보드로 유료 사이트 만들기 (서론) [6] | 한꼬마 | 2002.10.28 |
| [출처있음]NZEO 채널 흉내내기 [10] | (＇ _ ') napclub | 2002.10.28 |
| 현재 접속자 구하기...(파일2개) | inging-zb41 | 2002.10.26 |
| 사용자정의 함수 뽑아오는 함수입니다... [4] | 우트라 | 2002.10.23 |
| [추천 소스] 특정일로부터 지난날짜 혹은 남은날짜 구하기~ [5] | 박은석 | 2002.10.22 |
| [추천 소스] nzeo에 있는 북마크 기능 구현하기(hot key 는 제외) 초허접 강좌 [10] | 정승재 | 2002.10.22 |
| 이메일 주소 인코딩하기 [7] | 투유 | 2002.10.20 |
Java Applet을 활용한 업로드시 전송률 확인하기..
 | 아이쿠 | 2002.10.19 |
| www 떼고 접속하면 다시 www붙은 주소로 리다이렉션 걸기 [8] | [EC]POLARGOM | 2002.10.18 |
|
[PHP소스] 서버 시간에 따라 배경이 바뀌는 테이블!!
[8]
| 조현 | 2002.10.11 |
| 페이지에 접속할 때마다 다른 배너보여주는 소스.. [9] | 풍월주인 | 2002.10.07 |
|
exp. 완전 랜덤배너 소스
[8]
| TheMics | 2002.10.12 |
| 11. PHP에서의 변수형 [1] | 한꼬마 | 2002.10.04 |
| 10. 문자열(STRING) 처리 및 관련함수 [1] | 한꼬마 | 2002.10.04 |
| 9. 표현식(Expressions) - 연산자 | 한꼬마 | 2002.10.04 |
| 8. PHP 의 제어구조 [1] | 한꼬마 | 2002.10.04 |
| 7. 함수(FUNCTION) 와 클래스(CLASS) | 한꼬마 | 2002.10.04 |
| 6. 시간관련 함수 | 한꼬마 | 2002.10.04 |
| 5. 파일 처리 관련 함수 [1] | 한꼬마 | 2002.10.04 |