iframe을 부득이하게 사용하는 웹페이지를 만들다보면 iframe의 크기를 자꾸 바꿔줘야 하는 경우가 왕왕 발생한다. 다음의 예제는 iframe의 크기를 자동으로 바꿔주는 예제이다.
kurapa.com에도 적용해 보았는데, 잘 동작하는 것을 확인하였다.
<iframe id='ifrm' frameborder=0 width=100% height=450 scrolling=no src='http://m.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>
Tags: auto resize iframe iframe reise
|