- ベストアンサー
マウスオーバーで複数の画像を表示したいです。
マウスオーバーで複数の画像を表示したいです。 マウスオーバーで複数の画像を任意の場所に表示して、 マウスアウトでそれぞれの画像を非表示にしたいです。 やりたい事は ■にマウスオーバーすると□が表示され、□をどれかマウスオーバーしても、□の画像3枚全部とも表示は続いてほしいです。■と□のどれかからマウスアウトすると非表示にしたいのです。 ■ □ □ □ よろしくお願いします。
- みんなの回答 (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>
お礼
丁寧に教えていただいてありがとうございます^^ これを元にさっそく頑張ってみたいと思います。 本当にありがとうございました!!!!