iframe에 삽입되는 내용에 따라 iframe의 사이즈가 자동으로 변경되는 소스.
두가지의 조건
1. 같은 서버내의 페이지를 iframe으로 삽입하는 경우.
2. 타 사이트의 페이지를 iframe으로 삽입하는 경우.
[같은 서버내의 페이지를 삽입하는 경우]
1. 부모페이지에서 해결하는 방법
<SCRIPT LANGUAGE="JavaScript">
<!--
function
resizeIframe(fr) {
fr.setExpression('height',
aaa.document.body.scrollHeight);
fr.setExpression('width',
aaa.document.body.scrollWidth);
}
//-->
</SCRIPT>
<iframe frameborder="0" id="
aaa" scrolling="no" src="xxx.htm" width=650
onload="resizeIframe(this)"></iframe>
2. iframe으로 삽입되는 페이지에서 해결하는 방법
아이프레임으로 삽입되는 페이지의 최하단에 아래내용 삽입
<script>
document.body.scrollIntoView(true);
parent.document.all.
aaa.height = document.body.scrollHeight;
</script>
부모페이지의 아이프레임 id를 aaa로 맞춤.
<IFRAME id=
aaa src="xxx.htm" frameBorder=0 width=0 scrolling=no height=0></IFRAME>
[다른 서버(사이트)의 페이지를 삽입하는 경우]
- 물론 다른사이트의 페이지 내용을 수정할수(관리권한이) 있어야 한다.
<부모페이지>
<iframe src="http://www.aaa.com/aaa.htm" frameborder="0" id="aaa" scrolling="no"></iframe>
<타서버 불려올 페이지(http://www.aaa.com/aaa.htm)>
<head>태그사이에 아래의 스크립트 삽입
<script language='JavaScript' type='text/javascript'>
<!--
function init(){
var doc = document.getElementById("infodoc");
doc.style.top=0;
doc.style.left=0;
if(doc.offsetHeight == 0){
} else {
pageheight = doc.offsetHeight;
pagewidth = doc.offsetWidth;
parent.frames["aaa"].resizeTo(pagewidth,pageheight);
}
}
//-->
</script>
body의 onLoad태그로 위 스크립트를 불러옴
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="init();">
본문내용을 지정한 id로 감싼다.(infodoc)
<div id='infodoc'>
.
.
.
내용
.
.
.
</div>
</body>
출처: http://horangi.tistory.com/4