- ベストアンサー
表示する画像をファイル名を受け渡すには？
始めまして。buroboと申します。 早速ですが下記について分かりましたら教えて下さい。 アルバム作成をしており1ページに2つのアイフレームがあります。左にはサムネイル用のmenu.htm、右には写真表示用のphot.htmを読み込んでいます。 phot.htmの<IMG SRC="001.jpg" border="0">の001.jpgをサムネイルをクリックした時に自動で変更するにはどうしたらよいでしょうか？ phot.htm 1枚で数百枚の写真を表示できるように作りたいと思っています。 よろしくお願いします。
- burobo
- お礼率33% (3/9)
- JavaScript
- 回答数5
- ありがとう数1
- みんなの回答 （5）
- 専門家の回答
質問者が選んだベストアンサー
<IFRAME name="menu" src="menu.htm"></IFRAME> <IFRAME name="phot" src="phot.htm"></IFRAME> としておいて menu.htmで <u><span onclick="parent.phot.document.images[0].src='001.jpg'">００１</span></u><br> <u><span onclick="parent.phot.document.images[0].src='002.jpg'">００２</span></u><br> とかすればいいと思います。
その他の回答 (4)
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
>私の説明不足でした。申し訳ありません。 いいえ、いちいち謝る必要はないですよ。（少なくとも私の場合は） ＞できればそこにhtmlを開いて 概ね、＃２，３にて、望んでおられるような動作をすると思うのですが・ IFRAME name="phot"にhtmlを開くとはどういう意味ですか？ IFRAME name="phot"に表示されているのは、phot.htmで、その中の画像を置き換えることができればいいのではないのですか？ 例えば、＃３の補足のサンプルで <p><img border="0" src="001.jpg" width="480" height="360"><br> 画像</p> とかすれば、画像という文字が表示されたままでimgが置き換えられると思うのですが、IFRAMEに直接表示されるということは、文字が消えてしまうという意味ですか？
お礼
すいません！解決していました！ BLUEPIXYさんの回答で私のやりたい通りになっていました。ありがとうございます。 なにを勘違いしたのか動作確認までしたのに・・・。 ほんとにありがとうございます。大変助かりました。 また何かありましたらよろしくお願いします。
- Ysan
- ベストアンサー率32% (44/136)
フレームにname=～というのを付けているでしょうか。 つけていないと出来ません。
補足
回答ありがとうございます。 ANo.3の補足にここで教わって試したソースを貼りました。問題ないと思うのですが・・・。私がやりたい詳細もそこに書かせて頂きました。 また何かありましたらよろしくお願いいたします。
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
#2>こちらでも画像を直接開いてしまう ええっ！ 直接画像を開いてしまうってことはないですよ。 IFRAMEにある一番目の<IMG>にファイル名をセットしているだけですから、何も変化しないというようなことはあっても、画像を直接開くことはないはずです。 どのように記述されたのか、補足してください。 （ＩＥ６とＦｉｒｅＦｏｘでは動作するのは確認しました）
補足
私の説明不足でした。申し訳ありません。 直接というのは右のiframeに直接画像を開いてしまう～ということでした。できればそこにhtmlを開いてサムネイルをクリックしたらそのhtml上に画像を開くようにしたいのです。したがいましてそのhtmlの<IMG SRC="001.jpg">の001.jpgがサムネイルをクリックしたときに002.jpg、003.jpgという風に変わってくれるとありがたいのですが・・・。 以下がテストしたソースです。 ■album.htm <body> <IFRAME name="menu" src="menu.htm"></IFRAME> <IFRAME name="phot" src="phot.htm"></IFRAME> </body> ■menu.htm <body bgcolor="#696969"> <u><span onclick="parent.phot.document.images[0].src='001.jpg'">００１</span></u><br> <u><span onclick="parent.phot.document.images[0].src='002.jpg'">００２</span></u><br> </body> ■phot.htm <body> <p><img border="0" src="001.jpg" width="480" height="360"></p> </body>
- うぃず（@Wizard_Zero）
- ベストアンサー率69% (344/495)
Wizard_Zeroと申します。 同じページで読み込む画像を変えるには、JavaScriptを使うかASPやPHPなどのサーバーサイドのスクリプトが利用できる環境が必要です。 打開策ですが、phot.htmlで読み込むのではなく、直接画像ファイルを開いちゃったらどうでしょう？ <A HREF="hoge.jpg" TARGET="frame名"><IMG ..(略)...></A>
補足
早速の回答ありがとうございます。 直接画像を開くのはやってみたのですが、iframeの背景色や画像の配置場所が細かく設定出来なかったので断念しました。 次に写真を入れたhtmlを・・・と思ったのですが、これを数百枚も作るのは手間が掛かりすぎると思いこのような質問をしている次第です。 よろしくお願いします。
補足
返信遅くなって申し訳ありません。 早速の回答ありがとうございます。 こちらでも画像を直接開いてしまうので残念ですが別の回答を待ちたいと思います。 ありがとうございました。