Html & Script

iframe 높이 자동 맞추기

페이지 정보

본문

이전에 만들었던 것에 대해서 많은 분들이 사용법을 좀 어려워하더군요.
그래서 잠도안오고 생각난김에 한번 만들어봤습니다.

<script>
function _resize(frameID, minHeight) {
  var obj = document.getElementById(frameID);
  var _body = obj.contentWindow.document.body;
  var _height;

  if (_body == null) {
    setTimeout("_resize('"+frameID+"', "+minHeight+")", 500);
  } else {
    _height = _body.scrollHeight + 10;
    obj.style.height = (_height < minHeight)?minHeight:_height;
  }
}
</script>

위 소스를 [iframe 태그가 있는 문서]에 삽입하시고 아래처럼 iframe 태그를 적고 난 바로 아래에

<script>_resize(아이프레임아이디, 최소높이);</script>

를 입력하시면 알아서 iframe의 높이를 높여줍니다. ^^;;

단, 두 문서의 도메인이 같을 경우라는 것은 알고계시겠죠?

<HTML>
<script>
function _resize(frameID, minHeight) {
  var obj = document.getElementById(frameID);
  var _body = obj.contentWindow.document.body;
  var _height;

  if (_body == null) {
    setTimeout("_resize('"+frameID+"', "+minHeight+")", 500);
  } else {
    _height = _body.scrollHeight + 10;
    obj.style.height = (_height < minHeight)?minHeight:_height;
  }
}
</script>
<body>
<iframe src="test3.html" id="resize_frame"></iframe>
<script>_resize('resize_frame', 100);</script>
</body>
</HTML>

 
 

 
   
[참조] Wrox, Javascript Programmer's Reference
DOM level : 1
JavaScript : 1.5
JScript : 5.0
Internet Explorer : 5.0
Netscape : 6.0
Opera : 5.0

관련자료

등록된 댓글이 없습니다.
Today's proverb
유쾌한 사람은 자기 일에만 몰두하는 사람이 아니다. 때론 자신의 일을 전부 제쳐놓고 타인의 문제에 전력을 쏟는 열정이 있는 사람이다. 타인에게 자신의 힘을 나누어주고 마음을 열어주는 것은 자신의 삶을 행복하게 만드는 방법이다.