iframe内のwindowの高さを、iframe設置しているwindowへ通知して、iframeのサイズをiframe内のコンテンツwindowにジャストフィットさせる。
多階層親子反映とはiframe内のwindowの中に更にiframeが埋め込んだ時の連動も可能という意味です。
iframeってウェブページの結構として、SEO対策として、それ以外のも面倒な事があるのでお勧めはいたしません。
ちゅんラヂ プレイヤーの様な小さなガジェット埋め込み等の使い方としてならお勧めいたします。
iframe連携
iframeを設置したwindowと、iframe内のwindowに埋め込むJavaScript
__sizeChild.jsを参照してください。
上記スクリプトを設置できればクロスオリジン対応です。
例えば、ホームページとショップのドメインが別の場合に、お互いのコンテンツをiframeで埋め込みたい時に便利です。
iframeの記述
記述は下記のとおりです。
<iframe id="framexx" name="framexx" src="xxxxx.html" style="display: none;border:none; width:100%;" scrolling="no" frameborder="0">
</iframe>
この手法の制限事項を認識していないと、痛い目にあいます。
-
iframe内のページ内リンクや、親frameをtarget(_prarent)とするリンクは、期待通りに開かないようです。
一応、FirefoxとChromeで確認しました。他のwindowを開く(_blank)なら、期待通りに開きます。 -
positionをfixedさせて、スクロールさせても位置を保つ様なブロックはiframe内では意味をなしません。
何故なら、iframeの高さをページの高さ目一杯に広げているからです。 - iframeの高さをページの高さ目一杯に広げていますので、ページ内リンクでスクロールされません。
framesetが復活すれば簡単なのに
HTML5での廃止理由を読みましたが、ユーザービリティが良くないから、そうかなぁ？。アクセシビリティが悪い、そうかなぁ？。SEOで不利、Googleの都合？
だったらiframeは何故残すんだという疑問、JavaScriptで動的にローディングだってできる。
規格として廃止されたといっても、ブラウザは上位互換（過去のHTML文書も読める）でframesetは機能しますので、行儀悪く使い続けることも可能です。