iframe사용시 높이 자동 조절

by 조쉬 posted Jun 19, 2015
?

단축키

Prev이전 문서

Next다음 문서

ESC닫기

크게 작게 위로 아래로 댓글로 가기 인쇄
iframe사용시 높이 자동 조절   
 
iframe 사용시 iframe의 높이가 내용의 높이만큼 자동으로 조절되는 기능입니다.

아래의 내용을 <head>와 </head>안쪽에 넣는다. 


  1. <script language='JavaScript' type='text/javascript'>
  2. function resizeFrame(iframeObj){
  3.         var innerBody = iframeObj.contentWindow.document.body;
  4.         oldEvent = innerBody.onclick;
  5.         innerBody.onclick = function(){ resizeFrame(iframeObj, 1);oldEvent; };
  6.  
  7.         var innerHeight = innerBody.scrollHeight + (innerBody.offsetHeight - innerBody.clientHeight);
  8.         iframeObj.style.height = innerHeight;
  9.  
  10.         if( !arguments[1] )        /* 특정 이벤트로 인한 호출시 스크롤을 그냥 둔다. */
  11.                 this.scrollTo(1,1);
  12. }
  13. </script>


iframe을 다음과 같이 넣는다.

--------------------------------------------------------------------------------------------------------
 <iframe width=600 height=600 src="내용의경로" onload="resizeFrame(this)"  frameborder=0></iframe>         
--------------------------------------------------------------------------------------------------------


위와 같이 넣으면 ifrmae의 크기가 자동조절된답니다.