• ベストアンサー

マウスオーバーで複数の画像を表示したいです。

マウスオーバーで複数の画像を表示したいです。 マウスオーバーで複数の画像を任意の場所に表示して、 マウスアウトでそれぞれの画像を非表示にしたいです。 やりたい事は ■にマウスオーバーすると□が表示され、□をどれかマウスオーバーしても、□の画像3枚全部とも表示は続いてほしいです。■と□のどれかからマウスアウトすると非表示にしたいのです。 ■ □ □ □ よろしくお願いします。

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

  • ベストアンサー
  • zeff
  • ベストアンサー率69% (137/198)
回答No.1

<ul>を入れ子にします。 あとは□を<img>にするだけです。 <style type="text/css"> <!-- ul{ list-style-type : none; margin:0px;padding: 0px; } --> </style> <script type="text/javascript"> <!-- function showImgs(id){ document.getElementById(id).style.display = ''; } function hideImgs(id){ document.getElementById(id).style.display = 'none'; } //--> </script> </head> <body> <ul> <li onmouseover="showImgs('imgs1')" onmouseout="hideImgs('imgs1')">■ <ul id="imgs1" style="display:none;"> <li>□</li> <li>□</li> <li>□</li> </ul> </li> </ul> </body> </html>

rossi46mail
質問者

お礼

丁寧に教えていただいてありがとうございます^^ これを元にさっそく頑張ってみたいと思います。 本当にありがとうございました!!!!

関連するQ&A