FireFox, IE에서 모두 iframe 사이즈 자동 조절 하는 방법 > 명령어모음 cmd.kr

• 목록

iframe을 부득이하게 사용하는 웹페이지를 만들다보면 iframe의 크기를 자꾸 바꿔줘야 하는 경우가 왕왕 발생한다.
다음의 예제는 iframe의 크기를 자동으로 바꿔주는 예제이다.

kurapa.com에도 적용해 보았는데, 잘 동작하는 것을 확인하였다.

<iframe id='ifrm'
                frameborder=0
                width=100%
                height=450
                scrolling=no
                src='http://kurapa.com'
></iframe>

<script language='javascript'>

function getDocHeight(doc)
{
  var docHt = 0, sh, oh;
  if (doc.height)
  {
    docHt = doc.height;
  }
  else if (doc.body)
  {
    if (doc.body.scrollHeight) docHt = sh = doc.body.scrollHeight;
    if (doc.body.offsetHeight) docHt = oh = doc.body.offsetHeight;
    if (sh && oh) docHt = Math.max(sh, oh);
  }
  return docHt;
}

function getReSize()
{
  var iframeWin = window.frames['ifrm'];

  var iframeEl = window.document.getElementById? window.document.getElementById('ifrm'): document.all? document.all['ifrm']: null;

  if ( iframeEl && iframeWin )
  {
    var docHt = getDocHeight(iframeWin.document);

    if (docHt != iframeEl.style.height) iframeEl.style.height = docHt + 'px';
  }
  else
  { // firefox
    var docHt = window.document.getElementById('ifrm').contentDocument.height;
    window.document.getElementById('ifrm').style.height = docHt + 'px';
  }
}

function getRetry()
{
    getReSize();
    setTimeout('getRetry()',500);
}
getRetry();
</script>

출처: http://kurapa.com