- 締切済み
ホームページ作成の際、インラインフレームでの写真表示方法について
下記のようなことは出来ますでしょうか？ 右サイドバーに写真1、写真2・・・というようにサムネイルを表示していきます。 そのサムネイルをクリックすると、左のメインフレームの中央に、その写真の拡大されたものが表示されるといった具合です。 別ウインドウで表示されるのではなく、同じページ内（インラインフレーム？）で表示したいです。 初心者で、検索していろいろ調べましたが、お手上げになってしまいました。。 こだわり過ぎても駄目だと思うんですが、これが解決しないのでなかなかHP作成が進みません。 誰か教えてください！
- willbenice
- お礼率100% (2/2)
- HTML
- 回答数2
- ありがとう数4
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- 神崎 渉瑠（@taloo）
- ベストアンサー率44% (1016/2280)
iframeの項目に解説がなければ、framesetやframeの項目を見てみてください。 <iframe src="about:blank" name="enlarge" width="300" height="300"></iframe> <a href="image1.jpg" target="enlarge"><img src="thumbnail1.jpg"></a> <a href="image2.jpg" target="enlarge"><img src="thumbnail2.jpg"></a> iframeにnameを指定し、<a target="">を指定してください。
- nadera
- ベストアンサー率83% (5/6)
基本的な構造のサンプルです。インラインフレームは使っていません。 画像は，同じフォルダにあると仮定しています。 写真1と写真2は，サムネイル表示も同じファイルをweidthの設定で小さく表示するという前提ですが，サムネイル用のファイルを準備するときはそのようにファイル名を変更します。 <html> <head> <script language="javascript" type="text/javascript"> function hyoji(gazo){ document.getElementById("here").innerHTML="<img src='" +gazo+"' width='800' />"; } </script> </head> <body> <table> <tr> <td width="810"> <div id="here">ここに大きく表示</div> </td> <td valign="top"> <a onclick="hyoji('写真1.JPG');"><img src="写真1.JPG" width="160" /></a><br /><br /> <a onclick="hyoji('写真2.JPG');"><img src="写真2.JPG" width="160" /></a><br /><br /> </td> </tr> </table> </body> </html>
お礼
詳しくご説明頂き、とても参考になりました！ ありがとうございます☆
お礼
ありがとうございます。 やってみると簡単で分かりやすかったです☆(^^)/