iframe 高さ 自動調整
iframeに異なるドメイン(クロスドメイン)のコンテンツを読み込んで高さを自動調節する方法 - みのるの備忘録
wordpress (親) 側の設定
<apex:iframe id="iframe" src="{!IF(isURL,Url, URLFOR($Resource.test))}" scrolling="no" width="100%"/>
<html>
<head>
<title>親</title>
<script src="js/jquery.js"></script>
<script>
window.addEventListener('message', function(e) {
var iframe = $("#fugapage");
var eventName = e.data[0];
var data = e.data[1];
switch(eventName) {
case 'setHeight':
iframe.height(data);
break;
}
}, false);
</script>
</head>
<body>
<iframe id="fugapage" src="http://fuga.com/" width="100%" height="auto" " frameborder="0" scrolling="no"></frame>
</body>
</html>
埋め込みたい別ドメインのページ (子)
fuga.com
<html>
<head>
<title>子</title>
<script type="text/javascript">
window.onload = function() {
var height = document.getElementsByTagName("html")[0].scrollHeight;
window.parent.postMessage(["setHeight", height], "*");
}
</script>
</head>
<body>
・・・
</body>
</html>