iframe高さ自動調整
- 互联网
- 2025-08-31 14:09:01
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 /" width="100%" height="auto" " frameborder="0" scrolling="no"></frame> </body> </html> 埋め込みたい別ドメインのページ （子）fuga
<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>iframe高さ自動調整由讯客互联互联网栏目发布，感谢您对讯客互联的认可，以及对我们原创作品以及文章的青睐，非常欢迎各位朋友分享到个人网站或者朋友圈，但转载请说明文章出处“iframe高さ自動調整”
