Приветствую.
Делаю поэтажное выделение на здание, через теги map area, использую плагин
maphilight
Проблема в том, что выделение срабатывает не всегда, баг возникает в браузерах Chrome и Opera
Гуглил решение, нашел только вариант с добавлением к тегу map id и name с одинаковым значением, но это не сработало.
Кто сталкивался с подобным, как заставить работать указанные браузеры?
<script type="text/javascript" src="http://davidlynch.org/projects/maphilight/jquery.maphilight.min.js"></script>
$(function() {
$(".map").maphilight();
});
<img class="map" alt="img/1470.jpg" src="http://s018.radikal.ru/i501/1402/07/2debaecf5527.jpg" usemap="#myMap" width="1470" height="827" />
<map name="myMap" id="myMap">
<area shape="poly" coords="177,164,359,147,591,156,852,193,852,259,591,240,358,237,177,244" class="class6 {fill:true,fillColor:'00ff00',fillOpacity:0.4,stroke:false}" id="id6" target="_self" title="title6"/>
<area shape="poly" coords="177,244,359,237,591,240,852,259,853,313,591,309,358,309,178,310" class="class5 {fill:true,fillColor:'00ff00',fillOpacity:0.4,stroke:false}" id="id5" target="_self" title="title5"/>
<area shape="poly" coords="177,310,357,309,591,310,853,314,853,368,592,378,359,380,178,374" class="class4 {fill:true,fillColor:'00ff00',fillOpacity:0.4,stroke:false}" id="id4" target="_self" title="title4"/>
<area shape="poly" coords="178,374,359,381,592,379,853,368,853,422,591,446,359,451,178,438" class="class3 {fill:true,fillColor:'00ff00',fillOpacity:0.4,stroke:false}" id="id3" target="_self" title="title3"/>
<area shape="poly" coords="178,438,359,451,591,445,853,421,853,476,592,514,358,525,177,508" class="class2 {fill:true,fillColor:'00ff00',fillOpacity:0.4,stroke:false}" id="id2" target="_self" title="title2"/>
<area shape="poly" coords="177,508,358,525,591,514,824,480,823,534,593,584,359,596,176,571" class="class1 {fill:true,fillColor:'00ff00',fillOpacity:0.4,stroke:false}" id="id1" target="_self" title="title1"/>
</map>
P.S. Если есть подробная документация (на русском) о создании подобного рода карты, буду рад ссылке. Пытался сделать с помощью Raphael, но не разобрался в документации.
Простой
Простой
