人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

iframe の中のHTMLの長さに追従して、iframe の大きさを変更することは可能なのでしょうか? javascript で可能だという話をききました。


●質問者: kaiketsu
●カテゴリ:ウェブ制作
✍キーワード:HTML JavaScript 追従
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● Mars
●35ポイント

こんな感じでしょうか。

・フレームの中身・高さが動的に変わるページ、文字サイズを変更された場合には未対応

・フレームの中身が別ドメインのページには対応不可能

<script type="text/javascript">
function sample(IFR){
IFR.contentWindow.document.body.style.overflow='hidden';
IFR.setAttribute('height',1);
IFR.setAttribute('height',IFR.contentWindow.document.body.scrollHeight);
};
</script>

<iframe src="sample.html" id="IFR" onload="sample(this)"></iframe>

http://www.google.com/search?q=iframe+%8D%82%82%B3%82%C9%8D%87%8...

◎質問者からの返答

こういった手法があるんですね。


2 ● edvakf
●35ポイント

iframe の中が、自分で自由にスクリプトを書いたりできるコンテンツでない限り、無理です。

自由にスクリプトを置ける場合、iframe の中と外で postMessage を使ってやりとりすることができます。

外。

iframe.contentWindow.onmessage = function(e) {
 var size = e.data.split(',');
 iframe.width = size[0];
 iframe.height = size[1];
}

中。

window.parent.postMessage(
 document.documentElement.scrollWidth + ',' + 
 document.documentElement.scrollHeight
);

という具合で。

document.documentElement.scrollHeight を使うか document.body.scrollHeight を使うかは標準モードか互換モードかによって代わります。http://www.albert2005.co.jp/study/javascript/miscellaneous.html#...

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ