iframe 높이 자동 맞추기
컨텐츠 정보
- 20,156 조회
- 7 추천
- 목록
본문
이전에 만들었던 것에 대해서 많은 분들이 사용법을 좀 어려워하더군요.
그래서 잠도안오고 생각난김에 한번 만들어봤습니다.
<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
그래서 잠도안오고 생각난김에 한번 만들어봤습니다.
<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
관련자료
-
링크
댓글 0
등록된 댓글이 없습니다.
