そのため、写真に複数の画像マップを作成しようとしています。次に、ホバーしている画像に基づいて、写真の下にある div から特定の情報を取得し、ホバーした画像の横に入力します。
<div class="runner_div">
<img src="http://cooleycollective.com/test/slrc/wp-content/uploads/2013/01/Em_full.jpg" width="680" height="705" usemap="#runner_wear" /></a></p>
<map name="runner_wear">
<area shape="poly" coords="264,18,237,33,243,72,276,83,328,79,311,29," href="#hat" alt="hat" />
<area shape="rect" coords="259,69,331,99" href="#" alt="glasses" />
</map>
</div>
<div class="gear" id=hat>
<h2>Type of hat</h2>
<p>I love this hat.I wore it when I was running from a bear in the zoo.</p>
</div>
<div class="gear" id="glasses">
<p>These glasses were hand picked by a Sherpa from Kentucy!</p>
</div>
divを下に置いて非表示にしないようにするだけでなく、参照する画像にカーソルを合わせたときにホバーできるようにする機能も必要です。これにjQueryを使用する必要があるのか 、そのコードを作成する方法さえわからない.
コードが次のようなことをするような気がします: この imgmap の onmouse ホバーは、この imagemap が参照する div を表示します。これがコード言語でどのように見えるかはわかりません。助けてくれてありがとう。