今、サークルのホームページを作っていて、写真のページを作成しています。今までの表示方法とは変えて作りたいと思っているのですが、やり方がわからないので困っています。理想に近いページはこれです↓ http://seirei.ath.cx/youngtc/cgi-bin/album/album.cgi?mode=main&action=view&no=194&photono=1&tailno=.jpg&wno=480&hno=269 （URLが長くてすみません。）サムネイル画像をクリックすると、同じ場所に写真が表示されます。 cgiを使っているようですが、cgiは詳しくはわかりません。 htmlならわかるのでフレームで作ろうとしたのですが、同一ページで写真だけ変えて表示する方法がわかりません。どなたかこんな感じにできる方法をご教授ください。ちなみに、現在HPはソフト等使わずに作っています。

javascriptを使用すればページ移動もなく理想なものが実現できます ■■HTMLの内に以下を記述■■ '; document.getElementById("msg").innerHTML = msg; } // --> ■■以下は内の任意の場所に記述■■ ■理想ページの上部部分、各サムネイルの記述（実際は画像分用意） ▽画像サムネイル▽ △変更する部分 onclickの後にある下記の△と▲、▽部分です ■画像を表示したい箇所に以下を記述（１つだけ） △説明このspanの中に画像が表示されます最初から何か画像等を表示したい場合は上記内に記述しても大丈夫です ■説明を表示したい箇所に以下を記述（１つだけ） △説明このspanの中にコメントが表示されます最初から何かコメント等を表示したい場合は上記内に記述しても大丈夫です ■■記述例■■ '; document.getElementById("msg").innerHTML = msg; } // --> ここに写真が表示されるよここにコメントが出るよ ■■注意■■ ・idをspan以外のタグに付けるのは可能ですが、重複して使わないこと・change()内の画像パスとコメントは必ず「'」で囲まれていて、「,」で区切られている形にする・change()内で区切り以外の「'」や「"」は使わないこと ■■最後に■■ 記述内容は最小限で書いていますので、後はご自分でカスタマイズしてくださいまた、今回はとりあえず理想の内容を実現させるためのものなので、javascriptに関する説明は省いています細かい内容まで知りたい場合は、javascript内で使われている単語を検索にかけるとかなり出てきますので、そちらで勉強するのをおすすめします

色々な画像を指定の場所に表示したい

解決済

質問者：sky-diva
質問日時：2006/09/04 15:54
回答数：3件

今、サークルのホームページを作っていて、
写真のページを作成しています。
今までの表示方法とは変えて作りたいと思っているのですが、やり方がわからないので困っています。

理想に近いページはこれです↓
http://seirei.ath.cx/youngtc/cgi-bin/album/album …
（URLが長くてすみません。）

サムネイル画像をクリックすると、同じ場所に写真が表示されます。
cgiを使っているようですが、cgiは詳しくはわかりません。
htmlならわかるのでフレームで作ろうとしたのですが、
同一ページで写真だけ変えて表示する方法がわかりません。

どなたかこんな感じにできる方法をご教授ください。

ちなみに、現在HPはソフト等使わずに作っています。

通報する

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

質問の本文を隠す

回答 (3件)

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

No.3ベストアンサー

回答者： suzuki-_-
回答日時：2006/09/05 02:03

javascriptを使用すればページ移動もなく理想なものが実現できます

■■HTMLの<head></head>内に以下を記述■■


<script type="text/javascript">

</script>


■■以下は<body></body>内の任意の場所に記述■■

■理想ページの上部部分、各サムネイルの記述（実際は画像分用意）

<a onclick="change('△画像のURLパス△','▲コメント▲')" style="cursor:pointer">▽画像サムネイル▽</a>

△変更する部分
onclickの後にある下記の△と▲、▽部分です

■画像を表示したい箇所に以下を記述（１つだけ）

<span id="pict"></span>

△説明
このspanの中に画像が表示されます
最初から何か画像等を表示したい場合は上記<span>内に記述しても大丈夫です

■説明を表示したい箇所に以下を記述（１つだけ）

<span id="msg"></span>

△説明
このspanの中にコメントが表示されます
最初から何かコメント等を表示したい場合は上記<span>内に記述しても大丈夫です

■■記述例■■

<html>
<head>
<script type="text/javascript">

</script>
</head>
<body>
<div>
<a onclick="change('00.gif','全員の写真です')" style="cursor:pointer"><img src="00.gif"></a>
<a onclick="change('01.gif','○○君')" style="cursor:pointer"><img src="01.gif"></a>
<a onclick="change('02.gif','○○さん')" style="cursor:pointer"><img src="02.gif"></a>
</div>
<div><span id="pict">ここに写真が表示されるよ</span></div>
<div><span id="msg">ここにコメントが出るよ</span></div>
</body>
</html>

■■注意■■
・idをspan以外のタグに付けるのは可能ですが、重複して使わないこと
・change()内の画像パスとコメントは必ず「'」で囲まれていて、「,」で区切られている形にする
・change()内で区切り以外の「'」や「"」は使わないこと

■■最後に■■
記述内容は最小限で書いていますので、後はご自分でカスタマイズしてください
また、今回はとりあえず理想の内容を実現させるためのものなので、javascriptに関する説明は省いています
細かい内容まで知りたい場合は、javascript内で使われている単語を検索にかけるとかなり出てきますので、そちらで勉強するのをおすすめします

- 0
- 件

通報する

この回答へのお礼

回答ありがとうございます。
まさにこれです！
javaも普段はコピペだけで、自分では全くわからないので、このようにスクリプトを書いてくださって助かりました！
とりあえず作ってみたらこの先自分でカスタマイズできそうなので、やってみたいと思います。

通報する

お礼日時：2006/09/05 12:23

No.2

回答者： touro
回答日時：2006/09/04 16:44

フレームを使って、target属性でリンク先を別フレームに表示するように指定すれば同じようなページは作れると思いますが…。

参考URLをご覧ください。

参考URL：http://www.asahi-net.or.jp/~ax2s-kmtn/ref/html/h …

この回答への補足

作ってみたページでは、まずフレームで上下に分け、下にはサムネイル、そしてそのサムネイル画像をクリックすると上のフレームに大きな写真がでるようになってます。
しかし、
<a href="IMGP2100.JPG" target="ue"><img src="IMGP2100.JPG"></a>
という記述で、写真そのものにリンクしているので、写真を真ん中に表示したりコメントをつけたりすることができません。
フレームを使った場合、１枚の写真につき、１つのhtmlファイルを作らないと、真ん中に表示したりコメントをつけたりできないのでしょうか？

補足日時：2006/09/04 23:22

通報する