iframeの高さをコンテンツにあわせる
iframeで呼ばれたコンテンツの高さが一定でない場合、スクロールバーが出たり、はみ出た部分が消えてしまったりしないように高さを調節したいことがあります。
そういった場合には、loadイベントでコンテンツがロードされた後でアジャストしてやります。
[
フレーム]
$(document).ready(function(){
$('iframe').load(function(){
if (typeof $(this).attr('height') == 'undefined') {
$(this).height(this.contentWindow.document.documentElement.scrollHeight+10);
}
});
$('iframe').triggerHandler('load');
});
最後に+10しているのは、iframeのpadding分です。
より汎用的に行うには、$(this).css('padding-top')などを取得してやるのが良いでしょう。
リロード時など、documentがready状態になる前にiframeの中身がロードもしくはキャッシュされている場合にも動作するように、明示的に呼んでやっていることに注意して下さい。