2006년 11월 6일 월요일

[팁] iframe사용시 높이 자동 조정

  [팁] iframe사용시 높이 자동 조정

  트랙백 주소 : http://www.sir.co.kr/bbs/tb.php/pl_dhtml_javascript/475

iframe 사용시 iframe의 높이가 내용의 높이만큼 자동으로 조절되는 기능입니다.
아래의 내용을 <head>와 </head>안쪽에 넣는다.

---------------------------------------------------------------------
<script language='JavaScript' type='text/javascript'>
function resizeFrame(iframeObj){
        var innerBody = iframeObj.contentWindow.document.body;
        oldEvent = innerBody.onclick;
        innerBody.onclick = function(){ resizeFrame(iframeObj, 1);oldEvent; };

        var innerHeight = innerBody.scrollHeight + (innerBody.offsetHeight - innerBody.clientHeight);
        iframeObj.style.height = innerHeight;

        if( !arguments[1] )        /* 특정 이벤트로 인한 호출시 스크롤을 그냥 둔다. */
                this.scrollTo(1,1);
}
</script>
---------------------------------------------------------------------

iframe을 다음과 같이 넣는다.
---------------------------------------------------------------------
<iframe width=600 height=600 src="내용의경로" onload="resizeFrame(this)"  frameborder=0></iframe>
---------------------------------------------------------------------

위와 같이 넣으면 ifrmae의 크기가 자동조정이 됩니다.

댓글 없음: