• ベストアンサー

サムネイルの画像を同ページ内のある固定された同じ場所に拡大画像を出す方法について

私自身ホームページに関する専門用語をほとんど知らないため 正確に私の意志をお伝えすることが出来ないかもしれませんが、どうか、お力添えのほどよろしくお願いします。 下記のURL http://www.alan1.net/jp/hawaii/oahu/sg/106/ag/5641/ にあるように、サムネイルのいずれの画像(小さい)をクリックしても、同ページ内のある固定された同じ場所に拡大した画像(大きい)を出す方法を教えていただけないでしょうか? 申し訳ございませんがよろしくお願いいたします。

  • HTML
  • 回答数2
  • ありがとう数9

質問者が選んだベストアンサー

  • ベストアンサー
  • leap_day
  • ベストアンサー率60% (338/561)
回答No.2

こんにちは #画像を変換する処理です# <script language="JavaScript"> <!-- function Image(img) {  document.getElementById("image").src = img; } //--> </script> #提示サイトの小さい画像にあたる部分です# <img src="sample1.gif" onClick="Image('sample1.gif')"> <img src="sample2.gif" onClick="Image('sample2.gif')"> <img src="sample3.gif" onClick="Image('sample3.gif')"> <img src="sample4.gif" onClick="Image('sample4.gif')"> #提示サイトの大きい画像にあたる部分です# <img src="sample0.gif" name="image" width="100px" height="100px" border="1"> #~~#の部分は説明なので削除してコピペしてくださいね(^^) あとそちらで変更してもらうのは画像の名前です sample○.gifの部分を画像のファイル名に変えてください 画像をフォルダ内に入れているのであれば (フォルダ名)/(画像名) のようにしてください

kohjimurai
質問者

お礼

丁寧なコメント付きで返信して頂きましてありがとうございました。 早速ご支持頂いたとおりに行ってみたところ、簡単に表示することができました。 どうもありがとうございます。

その他の回答 (1)

  • MAN_MA_RUI
  • ベストアンサー率41% (426/1024)
回答No.1

http://www.red.oit-net.jp/tatsuya/java/image3.htm これのonmouseoverと書いてある部分をonclickに変えれば出来ると思います。

kohjimurai
質問者

お礼

参考になるURLを教えて頂きましてありがとうございました。 onclick以外にonmouseoverもからめてHPを作成しようと思います。 ありがとうございました。

関連するQ&A

  • サムネイル画像にマウスオーバーすると拡大表示するプログラムについて。

    下記のように指定した場所に拡大表示をすることはできます。 http://www.alan1.net/jp/hawaii/oahu/sg/106/ag/5641/ この拡大表示される画像に角度をつけることはできますか? 例えばポラロイド写真のような枠がすこしななめに貼付けてあるような感じにしてあって、そこに画像を拡大表示させたいのです。 できるでしょうか? よろしくお願い致します。

  • ハワイのパワースポットおすすめは?

    12/28-31まで2拍4日の弾丸でハワイに行きます。 パワースポットに行きたいのですが、お勧めのツアーがあれば是非教えてください! 宜しくお願いします。ハワイ島は日程的に諦めています。。 現在の候補は以下です。 値段設定も妥当なのか指摘あればお願いします。 http://www.hawaii-arukikata.com/coupon/spiritual_healing.html http://www.alan1.net/jp/hawaii/oahu/sg/2841/ag/14532/

  • 12月にハワイでスカイダイビングをします。半そでで大丈夫ですか?

    12月にハワイに行くのですが、スカイダイビングをしようと思っています。 ホームページなどを見ると、半そでで飛んでいるのですが、14000フィートは、富士山よりも高い地点です。 半そででも大丈夫なのでしょうか? http://www.alan1.net/jp/hawaii/oahu/sg/20/ag/5044/ 12月に、スカイダイビングをされた方、服装のアドバイスをいただければ幸いです。 ちなみに、スカイダイビングをするのは初めてです。

  • サムネイル画像をクリックすると拡大画像を表示させる方法

    今はまずサーバに同一画像の小さい写真(サムネイル用)と大きい写真の両方をアップロードして、 小さい画像を表示させて、そこにリンクをつけて大きい画像のURLへとばすようにタグを書いているのですが、これでは同じ写真を2枚アップロードしなくてはいけず、面倒です。 1枚の写真だけをアップロードしてサムネイル画像を表示させて、クリックしたら拡大写真がでるようにするためにはどのようなタグを使えばいいのでしょうか?

    • ベストアンサー
    • HTML
  • サムネイルページの作成方法について教えてください!

    ホームページビルダー13を使用して、サムネイルページを作ろうとしています。 私が作りたいのは、マウスポインタを縮小画像上に乗せたときに同一ページ上に拡大画像が表示されるようなページです。 そういうページをホームページビルダーで作ることはできるのでしょうか? 初心者のような質問かもしれませんが、詳しい方がいましたら教えてください。よろしくお願いします。

  • サムネイルクリックで、画像をチェンジさせたい

    初心者です。よろしくお願いします。 いくつか並んだ小さなサムネイル画像をクリックすることで、少し離れた大きめ画像をそれぞれのサムネイル画像の拡大に変えたいです。 下記のページの答えを参考にしてやってみました。http://oshiete1.goo.ne.jp/qa1192554.html その時は上手にできました。 ただ、それが同一ページの中に画像違いで、下にあと2つ必要なのです。 原理は同じかと思い、上手にできたものをコピーペーストしてあとの2つを作りました。 しかし、あとで作った2つの画像群の中、サムネイルをクリックすると画像が切り替わって欲しい所ではなく、別のセクションのほうの画像が切り替わってしまいます。 どうすれば思った場所の画像を切り替えられますでしょうか? もしくは、同一ページ内で3枚という複数にターゲット画像を分けることはムリなんでしょうか? 文章が解りづらくて申し訳ございません。

    • ベストアンサー
    • HTML
  • ハワイ年末年始ハネムーンのスケジュールについて

    大体予定が固まってきたのですが、下記のスケジュールに「無理がある」とか 「私ならこうする」とか、ご意見をお伺いできれば・・・と思います。 31日のディナーショー以外は、夕食も含めて予約済です。 宿泊はハイアットリージェンシーです。 悩んでいるのはイルカ中学をやめて、レンタカードライブ&買物にしようかなぁというところです。 でも、絶対これを買いに行きたいとかは今のところないです。 ■12/29■ 22:00 名古屋出発 (日付変更線通過) ■12/29■ 10:00 ホノルル空港着 13:00 ロミロミマッサージ75分(バンク・オブ・ハワイ・ワイキキ・センター) 15:00 チェックインし、明日以降の予約確認等 18:00 夕食(ホテル内)   ■12/30■ 6:30  ゴルフ出発(カトウゴルフ送迎付)マカハ・バレーCC 15:00 ホノルルに戻って買い物 18:00 吉家で夕食(シェラトン・ワイキキ) ■12/31■ 6:20  イルカ中学 (12:30ホテル帰) http://www.alan1.net/jp/hawaii/oahu/sg/2343/ag/10000/ 18:00 ニューイヤーズ・イブ・ディナー・ショー(シェラトン・ワイキキ) http://www.hawaiioption.com/special/year_end_special2011.html ■1/1■ 7:30  ノースショア(ハレイワ)観光 (18:30ホテル帰) http://www.alan1.net/jp/hawaii/oahu/sg/211/ag/797/ 19:00 田中オブ東京イーストにて夕食 21:30 ホテル室内にてロミロミ(60分) ■1/2■ 8:00  ホノルル空港へ出発 11:15 ホノルル✈ 以上ですが、みなさんのご意見ありましたら、ぜひお願いします。 ちなみに僕は初めてのハワイ、嫁さんは家族と行ったことが一度です。 よろしくお願いします。

  • 同ページ内の移動(HTMLに関して)

    私自身ホームページを作り始めたばかりに加え、専門用語をほとんど知らないため 正確に私の意志をお伝えすることが出来ないかもしれませんが、どうか、お力添えのほどよろしくお願いします。 あるリンク内にある文字をクリックすると、同じページ内の指定した箇所に自動で移動し(スキップ?)、 すぐにその文字に関する詳細な説明を見ることが出来る(その説明文の最終行には、 ページ先頭へというリンクもついており、すぐに同じリンク内の先頭へ戻ることが出来る) ように設定しているウエブサイトを見かけますが、私としては非常に便利だなぁと感じております。 参考URL:http://www.woolmark.gr.jp/knowledge/knowledge02.html 上の説明では、私が意図していることが分からないかもしれませんが、 万が一意図を理解してくだされば、どのように設定すれば、 上記のようなことを行うことが出来るか教えてくいただけないでしょうか? ご迷惑をおかけしますが、教授の程よろしくお願いします。

    • ベストアンサー
    • HTML
  • Flashで表示されたサムネイルをJavaScriptで拡大表示したい

    HTMLはある程度わかるようになってきただけのJavaScript初心者なのですが、HP制作の途中、Flashを使っていて分からないことが出てきました。 教えていただけるとうれしいです。 Flashのメニューを使っていて、そのメニューはリンク先がカスタマイズ可能です。 リンク先の指定は、テキストファイルの中に記述されている、 「 &url5=http://www.xxxxx.xxx.xx/& 」という場所で指定することになっています。 フォトギャラリーの写真のサムネイルをメニュー項目にして、Flashメニューでサムネイル選択したいと思っているのですが、そのサムネイルをクリックしたときに、同じページの別のテーブルに、そのサムネイルの大きな画像を表示させるということをしたいのですが、できるのでしょうか。 もしできるのなら、教えてほしいです。 Flashメニューでないサムネイルをクリックして拡大画像を表示ということはJavaScriptでできるのですが、Flashメニューで、となると不可能なのでしょうか。 よろしくお願いいたします。

  • css 画像切替 切り替えた画像クリック拡大表示

    こんにちは。 今ホームページを作っています。 サムネイル画像を押したら、ほかの場所にある画像が切り替わる仕組みと、 切り替わった画像をして、切り替わった画像の拡大画像が表示される仕組みを作りたいのですが、 そのためのCSSとhtmlの組み方がわかりません。 どなたかおわかりになる方がいましたらお願いします。 また画像にこうしたいというイメージがありますのでご参照ください。 画像の(1)~(2)までのイメージは以下URL パッと替われば大丈夫です。 http://sussiweb.com/hp/html/img/13.htm 画像の(3)~(4)までのイメージは以下URL パッと替われば大丈夫です。エフェクトなどありましたら参考URLおしえていただけると幸いです。 http://www.cssplay.co.uk/menu/cssplay-clickbox.html#url

    • ベストアンサー
    • CSS

専門家に質問してみよう