さすらいのWeb制作家、MAKOCHINがつづるブログサイト。
Web制作に関する知識を備忘録的に書いているだけのサイトです。
ほとんど自分で見るためだけに書いているような内容なので読みやすくはなっていませんが、Web制作のお役に立てれば幸いです。
ご興味のある方はどうぞ。

【JQuery】iframeの高さを動的に取得する - setIframeHeight -(クロスドメイン非対応)

Pocket
LINEで送る

iframeの高さを読み込むページの高さによって動的に変更する方法をご紹介。

まずは下記からJQueryライブラリのsetIframeHeightをダウンロードします。

iframeのスクロール属性をnoに設定する

親ページhtml

<iframe src="child.html" frameborder="0" scrolling="no">この部分は iframe 対応のブラウザでご覧ください。</iframe>

親ページにsetIframeHeightを読み込ませる

親ページhtml

    <script src="js/set-iframe-height-parent-min.js"></script>

子ページにもsetIframeHeightを読み込ませる

    <script src="js/set-iframe-height-parent-min.js"></script>

※親ページと子ページのドメインが同じでないと動作しませんのでご注意ください。(クロスドメイン非対応)

参考サイト

カテゴリー:HP制作, JQuery

コメントを残す

コメント内容