자바스크립트 iframe 내용에 따라 크기 자동 조절

자바스크립트 iframe 내용에 따라 크기 자동 조절

iframe를 사용해야 할 경우가 간혹 있습니다. 

그런데, iframe를 사용하려면 꺼려지는 마음이 먼저 드는데, 그 이유는 스크롤바가 생기기 때문입니다.

iframe에 담겨질 내용이 미리 지정된 iframe의 높이를 초과하는 경우가 분명히 발생하기 때문입니다.

정해진 내용을 iframe에 담을 일은 없죠. 분명 iframe 안에 담길 내용은 상황에 따라 바뀌는 내용입니다. 상황에 따라 바뀌게 되면 그 높이도 어떻게 될지 모르죠.

아래 소스를 참조해보세요. iframe 의 내용이 길어지면 같이 길어질 수 있도록 자동으로 크기롤 조절해주는 소스입니다.

iframe 자동 높이 조절

<iframe name=iname style='width:100%' scrolling=no frameborder=0 src='http://www.dwebs.co.kr' onLoad="setIFrameHeight(this)"></iframe>

<script>

function setIFrameHeight(obj){

    if(obj.contentDocument){

        obj.height = obj.contentDocument.body.offsetHeight + 40;

    } else {

        obj.height = obj.contentWindow.document.body.scrollHeight;

    }

}

</script>