프로그래밍/Javascript

iframe resize jquery 아이 프레임 리사이징 소스

Nickoo 2016. 2. 2. 21:12
반응형

요즘 반응형이 아이프레임을 리사이징 하는것에 대해서는 어떻게 해야 난감할때가 있습니다.

 

일반 리사이징하면 가로*세로 비율이 유지되면서 리사이징이되는것을 생각하지만 기준이 가로폭이 됩니다.

 

하단에 스크립트 넣어주시고, 혹은 *.js로 저장하시고,

 

<script type="text/javascript">
function resize_frame(id) {
var frm = document.getElementById("embeded-content");
function resize() {
frm.style.height = "auto"; // set default height for Opera
contentHeight = frm.contentWindow.document.documentElement.scrollHeight;
frm.style.height = contentHeight + 300 + "px"; // 23px for IE7
}
if (frm.addEventListener) {
frm.addEventListener('load', resize, false);
} else {
frm.attachEvent('onload', resize);
}
}
resize_frame('embeded-content');
</script>

 

해당 아이프레임에 아이디값 embeded-content을 줍니다. 높이를 제시해야.. 아이프레임 영역이 생성됩니다.

 


<iframe id="embeded-content" width="90%" height="800" frameborder="0" marginwidth="0" scrolling="no" src="경로주소"></iframe>

반응형