iframe은 사용하기에 참 편리하다.
하지만 iframe을 사용할때 생기는 스크롤은 여로모로 신경이 쓰인다. 스크롤 바는 부모 페이지에 한개, iframe에 한개 해서 도합 2개의 스크롤이 생긴다. 아래에 이를 간단히 해결 할 수 있는 자바스크립트를 소개한다. 이 소스를 이용해 iframe의 골칫거리인 스크롤을 없에고 마치 통으로 html을 작성한 것 처럼 홈페이지를 구성했다. 결과는 참 만족스럽다.
<script language="javascript">
<!--
function resize_frame(name) {
var oBody = document.frames[name].document.body;
var oFrame = document.all[name];
oFrame.style.width = oBody.scrollWidth + (oBody.offsetWidth-oBody.clientWidth);
oFrame.style.height = oBody.scrollHeight + (oBody.offsetHeight-oBody.clientHeight);
// 해당 iframe의 가로나 세로의 크기가 0px이면 발생하는 이벤트
if(oFrame.style.width == '0px' || oFrame.style.height == '0px') {
// 해당 iframe의 변경할 가로크기
oFrame.style.width = "500px";
// 해당 iframe의 변경할 세로크기
oFrame.style.height = "200px";
// 크기 변경 후 상태바에 표시하는 오류 메세지
window.status = 'iframe 크기 변경 실패';
}
}
//-->
</script>
<!--
resize_frame(ifrmae의 id);
//-->
<body onLoad="resize_frame('exiframe');">
<!--
** 절대경로는 안됨