重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら>

電子書籍の厳選無料作品が豊富!

<div>
<img src="image1" alt="" width="300" height="300" /><br />
<img src="image1" alt="" width="80" height="80" />
<img src="image2" alt="" width="80" height="80" />
<img src="image3" alt="" width="80" height="80" />
<div>

下の小さい画像にマウスが乗ったら、上の大きい画像に表示させたいのですが、どのように組んだらよろしいでしょうか、よろしくお願いいたします。

A 回答 (2件)

#1 です。

JSBin にコードを置きました。
http://jsbin.com/opalor/2/edit

対象ブラウザに指定がなかったので Element#classList を使用しています。
以下、参考リンク。

Element#classList
http://dom.spec.whatwg.org/#interface-element
https://developer.mozilla.org/en-US/docs/DOM/ele …
addEventListner (※MDN記述だと element.addEventListener とありますが、addEventListener は実際は Node についているのでこれは誤りです。element についていたら document.addEventListener なんて出来ない…。)
https://developer.mozilla.org/en-US/docs/DOM/ele …
http://dev.w3.org/2006/webapi/DOM-Level-3-Events …
attachEvent
http://msdn.microsoft.com/en-us/library/ms536343 …
    • good
    • 0
この回答へのお礼

ありがとうございました

お礼日時:2013/01/07 17:41

サムネイル画像(image1s.jpg)とオリジナル画像(image1.jpg)を用意し、mouseover 時にURL置換して適用するのが一般的な手法かと思いますが、どういう意味で質問していらっしゃるのでしょうか…。



# 個人的な感想ですが、yuu_x さんにわからない内容とも思えなかったもので何か私の思いつかないような意図があるのかと思ってしまいました。

この回答への補足

返答ありがとうございます。

># 個人的な感想ですが、yuu_x さんにわからない内容とも思えなかったもので何か私の思いつかないような意図があるのかと思ってしまいました。

(やっぱりばれたか)
単純に、しばらく触ってなかったら組めなくなってしまったのです。orz ちょっと触れば思い出すと思うので、コードを提示してくださると助かります。

補足日時:2013/01/06 23:14
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!