- ベストアンサー
選択された画像の表示
画像をＨＰに掲載する場合に、例えば画面の右側に10種類の画像の名前を記載します。 左側にフォトフレームのようなものを置いて、左の文字「画像１」をクリックするとフォトフレームの中に山の写真が出る、「画像２」をクリックすると山に変わって海の写真が出る、などのようなことができるでしょうか。 タグうちでのＨＰ作成初心者です。 よろしくお願い致します。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
その他の回答 (2)
再び失礼します。 補足読みました。 表示される内容のレイアウトについては、通常のHTMLをレイアウトする方法と同じです。 前回は、スタイルシートを使って、リンクの文字を右にフロートさせるような指定を入れていました。 これを書き換えて、部品の配置をし直せば良いでしょう。 なお、スクリプトは、リンクタグの中身を書き間違えない限りは問題なく動作すると思いますので、その部分を書き換えることを避ければ、HTMLを修正しても問題ないはずです。 具体的なソースですが、body内を以下のようなものにするのではいかがでしょうか。 <body> <p style="text-align: center;"> <img src="初めの画像のURL" name="imgs" alt="*"><br> <a href="#" onClick="roimg('画像1のURL'); return false;">画像1</a> / <a href="#" onClick="roimg('画像2のURL'); return false;">画像2</a> / <a href="#" onClick="roimg('画像3のURL'); return false;">画像3</a> / <a href="#" onClick="roimg('画像4のURL'); return false;">画像4</a> / <a href="#" onClick="roimg('画像5のURL'); return false;">画像5</a><br> <a href="#" onClick="roimg('画像6のURL'); return false;">画像6</a> / <a href="#" onClick="roimg('画像7のURL'); return false;">画像7</a> / <a href="#" onClick="roimg('画像8のURL'); return false;">画像8</a> / <a href="#" onClick="roimg('画像9のURL'); return false;">画像9</a> / <a href="#" onClick="roimg('画像10のURL'); return false;">画像10</a> </p> head内については、前回提示したものをそのまま使用してみてください。
お礼
また一歩勉強しました。 今後のページに応用します。 どうもありがとうございました。
- mousengoke
- ベストアンサー率50% (197/388)
こういうときはjavascriptを使って…… と書こうと思った毛左右に分かれてるならフレームでも大丈夫かもしれませんね。フレームについては参考URLを見てください。
お礼
フレームを既に使ったＨＰなのですが更にその中にフレームというのも可能でしょうか。 今後の参考にさせていただきます。 ありがとうございました。
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_1_thumbnail_img_sm.png)
補足
簡単にできました。ありがとうございます。 追加でお伺いさせていただけるなら、画像の位置を真ん中にして文字を下に書く場合はどこをどう変更すればようにでしょうか。