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

インラインフレーム(iframe)の枠を表示される内容によってサイズ変更するように出来ますか?スクロールバーは常に非表示が条件です。

●質問者: webmaster55
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:インラインフレーム サイズ スクロール
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● Yukari_beauty
●10ポイント

こんばんわ。

インラインフレームの表示は結構わかりやすいので

下記に設定方法書きますね。

<IFRAME name="list" width="★" height="★" src="http://?" align="center" border="0" leftmargin="0" topmargin="0"></IFRAME>

組み込むHTMLページのサイズに合わせて★の調整されるといいですね。

◎質問者からの返答

質問の仕方が悪かったようです。

フレームの枠内のページサイズによって自動的にフレームサイズが変わるような仕組みが知りたいです。


2 ● Mug
●60ポイント

3年くらい前に作っていたものがありました。

そのままサンプルとしてもって来ました。(変数名は置換しましたが)

◆親HTML◆

<iframe id="RenewalFrame" name="RenewalFrame" height="0" src="about:blank" frameborder="0" style="width:100%;margin-top:16px;"></iframe>

◆子HTML(JavaScript)◆

function RemakeFrameHeight() {

  if(parent && (parent != self) && ParentIframeId && parent.document.getElementById(ParentIframeId)) {

    if(document.all) {

      parent.document.getElementById(ParentIframeId).height = (document.body.scrollHeight + 2);

    } else {

      parent.document.getElementById(ParentIframeId).height = (document.body.offsetHeight + 2);

    }

  }

}

動きとしては、子HTMLのonloadでRemakeFrameHeight();を実行していました。そのときには変数ParentIframeIdには"RenewalFrame"が入っていたはずです。



親と子の表示されるページがN:1または1:Nの場合は、1の側にiframeのリサイズ関数を用意すると便利です。

どちらに作るにしろ、子がonloadしたときに子のサイズを測って、親のiframeのサイズを(若干の余裕をみて)変更します。

また、動的に変更したいのは横幅か高さか(両方か)、どの程度サイズに余裕をみるか、などによって値の決め方(元ネタ・取得方法・計算方法・代入先)が異なってくるでしょう。

このご質問では、そこまではわからなかったので、とりあえず方針としてはこれでできるはずです。


※上記は親:子=N:1であり、かつ高さのみ変更したかったケースでした。

◎質問者からの返答

探していた答えに近いと思います。試してみます!ありがとうございました。

関連質問


●質問をもっと探す●



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