Блог

вот немного моего кода:

 <div class="table1"> 

<img src="images/table.jpg" width="940" height="818" alt="Comparative table"    usemap="tablemap">

<map name="tablemap" >

<FIX1>
  <area href="page1.html" shape="rect" coords="1,116,105,184" alt="item1">
</FIX1>

</map>

</div>
 

и CSS для этого:

 .table1 {
    width:940px;
    height:818px;
    margin-left:-10px;
}


FIX1:hover{
    content:url(images/guppie.jpg);
    display:block;
    width:506px;
    height:506px;
    z-index:110;
    position:absolute;
    margin-top:-701px;
    margin-left:105px;
}
 

Я боролся за то, чтобы это работало, поэтому я использовал свой собственный тег. Очевидно, что я не эксперт.

Буду признателен за любую помощь любого рода. Я стремлюсь узнать все, что могу, поэтому, пожалуйста, не бойтесь критиковать.

У вас возникнут серьезные проблемы с тем, чтобы заставить это работать, поскольку поддержка DOM для карт изображений довольно сложна во многих браузерах.

Вы могли бы начать с сброса элемента FIX1 и присвоения идентификатора области:

 <area id="FIX1" href="page1.html" shape="rect" coords="1,116,105,184" alt="item1">
 

 #FIX1:hover{
    ....
}