• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:画像の切り替え+イメージマップ)

画像の切り替え+イメージマップ方法と問題の解決策

このQ&Aのポイント
  • JavaScriptを使用して画像を切り替え、それぞれの画像にイメージマップを作成する方法について問題があります。
  • クリック後の画像がウィンドウサイズに合わせて動いてしまう問題があります。
  • スクロールやウィンドウサイズ変更でも画像が動かないようにする解決策を知りたいです。

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

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

#1です。 ご質問の意味を勘違いしてたかも… >スクロールやウィンドウサイズ変更でも動かなくするにはどうすればよい でしょうか スクロールはともかく、ウィンドウサイズを変更してもレイアウトが変わらないようにするのなら、レイアウトを固定してしまうしかないでしょう。 bodyにwidthを設定して幅を固定するなどしておいて、ページ全体のレイアウトが変わらないように指定してゆく方法です。 例えばこんなの  http://www.css-designsample.com/csslayout/float-3column.html

ugoton
質問者

お礼

ご回答の内容で解決できました ありがとうございました。

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

掲げられているサンプルのように「position:absolute;top:0px;left:0px」みたいな指定がしてあれば、画像は全部重なっているはずですけれど? そうでない場合、visibilityを用いるとhiddenにしても非表示になるだけで、(特に指定がなければ)インライン要素としてレイアウトされるので、2番目、3番目の画像は右にずれたように見える可能性があります。 質問文からは不明ですが、position:absoluteの指定をはずしているのではないかと想像しますが? position指定をするか、displayで制御するようにすれば良いのでは?

関連するQ&A