画像の中にインラインフレームを作りたい

解決済

質問者：puwapuwapu
質問日時：2008/05/08 19:55
回答数：2件

大きな画像(例えば額縁の画像)の中に
インラインフレームを作りたいのですが、
どうしたらできますか？

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： steel_gray
回答日時：2008/05/08 20:45

背景画像を指定したブロックの中にiframeを配置します。

<div style="background-image:url('画像のURL');width:X1px;height:Y1px;position:relative;">
<iframe ～
style="position:absolute;top:X2px;left:Y2px;width:x3px;height:y3px;">～</iframe>
</div>

x1,y1 は画像の大きさ、
x2,y2 はiframeを配置する位置(画像の左上からの距離)
x3,y3 はiframeの大きさ

なお、iframeの背景は読み込んだページの背景になります。
これを、親ページの背景を透かせたい場合は次のように指定します。
<iframe ～ allowtransparency="true">
さらに、読み込ませるページの方でもbodyに指定をします。
<body style="background-color:transparent;">

- 0
- 件

通報する

この回答へのお礼

教えていただいたのをコピーして
簡単に作ることができました。

問題を解決できて、今はもうすっきりです！

ご丁寧な説明、本当にありがとうございました！！！！！！

通報する

お礼日時：2008/05/08 23:52

No.1

回答者： Fumi__
回答日時：2008/05/08 20:42

なかなか文章では説明しづらいのですが、２つの方法があります。

１つは額縁の画像を、上下左右の４つに分解して、
上段がセル１つ、中段が横並びにセル３つ、下段がセル１つのテーブルをつくり、
上段と下段には額縁の上と下の画像を、
中段の右端と左端のセルに右と左の画像を入れます。
セルの背景でもいいです。
画像がぴったりくっつくように余白、線の太さはすべて０にしてください。
そして、中段の真ん中のセルにインラインフレームを入れればOKです。

もうひとつの方法は、画像は分解しないでセルひとつのテーブルの
背景に指定します。テーブルのサイズを指定する必要があるかもしれません。
そして、テーブルの中にインラインフレームを入れるのですが、
額縁の画像と被らないよう、テーブルの内側の余白を指定してください。

以上です。変な表現で想像できないかもしれません。イラストならうまく説明できるんですが…。
こんな小手先の方法ですみません。もっといい方法があればそちらを参考に。