- ベストアンサー
マウスオーバーにて画像に虫眼鏡の画像を重ねる時のズレ
こんにちわ。 現在、imagelink.jsといったJAVAを使って画像にマウスオーバーした時に任意の画像に別の画像を重ねて表示するといった事が出来るものを見つけたのですが、表を作成し画像を並べると、マウスオーバーした際に全く別の所に表示されてしまいます。 表を作らずそのまま画像を縦に並べるだけだと正常に動作するのですが。。。 またFireFoxだと大丈夫でInternetExpiorer8だと本来任意の画像に重なって表示されるはずが、まったく違う場所に表示されます。 これを回避する方法などあるのでしょうか? 以下デモページになります。 http://cssglobe.com/lab/imagelink/
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (2)
- yuu_x
- ベストアンサー率52% (106/202)
- babu_baboo
- ベストアンサー率51% (268/525)
関連するQ&A
- マウスオーバーで複数の画像を表示したいです。
マウスオーバーで複数の画像を表示したいです。 マウスオーバーで複数の画像を任意の場所に表示して、 マウスアウトでそれぞれの画像を非表示にしたいです。 やりたい事は ■にマウスオーバーすると□が表示され、□をどれかマウスオーバーしても、□の画像3枚全部とも表示は続いてほしいです。■と□のどれかからマウスアウトすると非表示にしたいのです。 ■ □ □ □ よろしくお願いします。
- ベストアンサー
- JavaScript
- 画像のマウスオーバーの際のズレを直すには
CSSを用いてマウスオーバーで画像に枠を付けるスタイルを使用したのですが、マウスオーバーした際に枠が出ると同時に画像が少し右下にずれてしまいます。マウスオーバーで枠を表示させながら画像は固定させるという事は出来るのでしょうか?宜しくお願いします。
- ベストアンサー
- HTML
- マウスオーバーでフェードインする画像
背景画像の上にabsolute等で自由に配置でき、通常時は透明で非表示。マウスオーバーすることでフェードインして表示されるという画像を実装したいと考えています。 jsやqueryを使って、IE6に対応した作り方を探しています。 シンプルなものでどのような方法がありますでしょうか?
- ベストアンサー
- HTML
- マウスオーバーして画像を入れ替えたい
YahooのジオシティーズでHPを作成していますが、教えていただきたいことが2つあります。 1.javaスクリプトを使ってマウスオーバー、マウスアウトした時に写真を入替えたいと思っていますが、全くの初心者でどこにタグを入れていいのかわかりません。 どなたか下記URLのページの写真(1)にマウスオーバーした場合に写真(2)に変わり、マウスアウトすると写真(1)に戻るよう、下記URLのソースをすぐに使えるように手直ししていただけませんか?http://sky.geocities.jp/hokuto5131/test.html 2.Yahooのジオシティーズでマウスオーバーして画像を入替えるHPを見てみると、入替える画像のURLはimg.1のようになっていますが、私がYahooのジオシティーズに画像データを送ると上記のURLのソースのように『http://sky.geocities.jp/hokuto5131/~』になってしまいます。なぜでしょうか?またそのページに貼り付けていない画像データをどうやってYahooのジオシティーズのサーバーに送るのでしょうか? 以上よろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- 離れた場所にマウスオーバーで画像を変えたい。
宜しくお願いします。 色々と調べて試してみるのですが解決できず、こちらでご相談させ頂こうと思います・・・。 サイト内にあるボタン自体をマウスオーバーで変化させ、かつそのボタンを選択している時には、別の離れた場所にも指定した画像を表示させたいと考えております。 1つやっかいなのが、今回.3つ画像があるのですが、3つとも微妙に異なる場所へ表示させなければなりません。一応、簡単な資料を作成しましたので添付のデータをご確認頂きたいのですが・・・。 配置はそれぞれ記載されている感じで、#A、#B、#Cというコンテナ内に入っているボタン画像にマウスが行くと、ボタン自体もマウスオーバーで変化し、かつ、#container内の赤い画像の場所にも別のsampleA.pngを表示させたいと考えています。 BとCに関しても同様で、それぞれ個別の位置に画像を表示させたいと思います。 ボタン側のマウスオーバーは出来たのですが、更に加えて離れた場所に画像を表示させる方法が分かりません。 <div id="container">ここに画像を表示させたいです!</div> <div id="A"><a href="***"><img src="images/1.png" onmouseover="this.src='images/over1.png'" onmouseout="this.src='images/1.png'"></a></div> <div id="B"><a href="***"><img src="images/2.png" onmouseover="this.src='images/over2.png'" onmouseout="this.src='images/2.png'"></a></div> <div id="C"><a href="***"><img src="images/3.png" onmouseover="this.src='images/over3.png'" onmouseout="this.src='images/3.png'"></a></div> どなたか、こういった方法でサイトを作成させた方いらっしゃいましたらアドバイスいただけますと助かります。 どうぞ、宜しくお願いいたします。m(_ _)m
- ベストアンサー
- CSS
- マウスオーバーの情報が、この画像のように出ます。
マウスオーバーの情報が、この画像のように出ます。 「・・・よりも大きい」・・って。 なぜ、このようにアバウトなんでしょうか? きっちり、全てのサイズを表示させるには、なにか設定があるのでしょうか? よろしくお願いいたします。
- ベストアンサー
- Windows XP
- マウスオーバーについて
もう何度もいろいろなサイトでいろんな方がご質問されていたのですが どうしても理解できずどなたかお助けいただければと思い 投稿致しました。お力添えいただければ幸いです。 840px×400pxのフラッシュを作成しています。 縦400pxの上350pxが写真で、下50pxがボタン(横幅いっぱいに6つ並んでいます。)です。 下のボタンにマウスオーバーすると上の画像がボタンに準じた画像に入れ替わり、ボタンからマウスを放すとデフォルトの画像に戻るというものを作成しているのですが、どうにも原理が理解できず苦しんでいます。 上の部分に呼び出すには別のファイルか何かが必要なのですか? どなたかお教え願えませんでしょうか。 よろしくお願い致します。
- ベストアンサー
- Flash
- 画像にマウスを重ねると大きな画像を表示したい
illustratorでスライスを作製し、画像を生成しました。 1000×1076のサイズで32個の画像で構成されるスライスになっています。 そのスライスの一部の画像にマウスオーバーするとスライス全体の 1000×1076と同じサイズの背景透明画像を上に表示したいのです。 よくあるボタンのマウスオーバーなどでやると元画像のまわりに画像がある想定ではないためか、マウスオーバーするとスライスが崩れてしまいます。 本来Flashなどでやるようなことと思いますが、 iPadでも見たいためCSSやJavascriptで実現したいと思います。 よろしくお願い致します。
- 締切済み
- CSS
- メニューのマウスオーバーについて
表題の件ですが、やり方はとてもたくさんあります。 JavaScriptやcssなど。 JavaScriptの場合、検索結果で、メニューとして、JSを使用した箇所が表示されません。 画像置き換えの場合text-indent:-9999px;やdisplay:none;とした際、評価が下がるとのことです。 どちらにもデメリットがあるようですが、今主流となっているマウスオーバーでの画像の切り替えはどのようなものでしょうか。 ご協力お願いいたします。
- ベストアンサー
- CSS
- マウスオーバーで画像を拡大表示させたいです
http://www.videocopilot.net/tutorials/ 上記サイトのように、マウスオーバー画像をマウスオーバーするだけで マウスカーソルに追尾して画像やflvを表示させるには、どのようなプログラムを行えばよいのでしょうか? または、ソフトの購入などが必要なのでしょうか? ヒントまたは参考サイトなどございましたら、教えてください。 お願い致します。
- 締切済み
- JavaScript
お礼
お返事有難うございます。 大変助かりました。 無事ずれる事なく出来ました^^