아이프레임 iframe 리사이즈 resize 조절 하는 방법
https://github.com/davidjbradshaw/iframe-resizer
부모 페이지
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<title></title>
<style>
body {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<iframe src="https://www.xxxxx.com" width="100%" scrolling="no" frameborder="0"></iframe>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="/js/iframeResizer.min.js"></script>
<script type="text/javascript">
iFrameResize({
log : false, // Enable console logging
inPageLinks : true,
resizedCallback : function(messageData){ // Callback fn when resize is received
$('p#callback').html(
'<b>Frame ID:</b> ' + messageData.iframe.id +
' <b>Height:</b> ' + messageData.height +
' <b>Width:</b> ' + messageData.width +
' <b>Event type:</b> ' + messageData.type
);
},
messageCallback : function(messageData){ // Callback fn when message is received
$('p#callback').html(
'<b>Frame ID:</b> ' + messageData.iframe.id +
' <b>Message:</b> ' + messageData.message
);
alert(messageData.message);
document.getElementsByTagName('iframe')[0].iFrameResizer.sendMessage('Hello back from parent page');
},
closedCallback : function(id){ // Callback fn when iFrame is closed
$('p#callback').html(
'<b>IFrame (</b>' + id +
'<b>) removed from page.</b>'
);
}
});
</script>
</body>
</html>
iframe 자식 페이지
<script type="text/javascript" src="/js/iframeResizer.contentWindow.min.js"></script>