Как реализовать карту

LG
На сайте с 17.01.2014
Offline
42
254

Народ подскажите, как реализовать:

Есть карта с выделенными объектами, при наведении они выделяются, часть кода ниже. Но мне надо чтобы эти объекты выделялись при наведении на отдельные ссылки, к примеру:

Наводим на ссылку ниже

<a href="/">Париж <a>

а на карте выделяется область с определенными координатами.

<img src="images/02.png" alt="карта" class="map" usemap="#Map" border="0" style="position:absolute;left:0; top:0px; width:800px; height:743px; opacity:0" width="800" height="743"/>

</div>
<map name="Map" id="Map" class="map">
<area shape="poly" coords="480,536,493,542,515,542,523,534,536,534,541,543,550,543,554,550,561,548,584,564,592,554,599,556,622,531,624,514,631,514,631,504,636,499,636,473,623,473,610,453,604,457,598,447,590,453,584,447,590,436,577,436,575,423,572,416,570,408,577,408,577,398,572,398,561,387,554,392,539,382,514,382,499,387,505,395,503,416,513,425,500,436,514,452,514,460,508,460,496,452,479,465,467,463,467,467,477,480,478,490,462,501,467,518,451,521,442,525,434,528,434,533,452,548,464,543,475,543,480,536" onmouseover="over('<b>Описание участка</b> Поддерживает HTML-теги<br />')" onmousemove="move(event)" onmouseout="out()"
href="#" />
<area shape="poly" coords="355,682,349,669,359,661,365,661,369,645,387,645,397,638,409,638,417,644,417,630,423,612,422,601,417,601,417,587,416,578,429,564,422,554,409,550,406,545,393,535,382,542,375,549,342,549,334,564,327,564,320,554,317,564,320,582,281,625,287,638,291,638,299,640,303,644,317,661,328,673,339,686,355,686" onmouseover="over('<b>Описание участка</b> Поддерживает HTML-теги<br />')" onmousemove="move(event)" onmouseout="out()" href="#" />
<area shape="poly" coords="83,587,72,578,63,585,49,587,44,594,35,595,34,607,26,607,24,612,27,614,22,635,22,655,14,656,15,677,32,690,34,702,43,716,43,723,94,723,108,715,122,711,129,713,131,712,142,712,161,687,137,686,120,682,108,681,112,667,112,648,98,640,105,632,94,623,100,614,90,612,77,606,80,586" onmouseover="over('<b>Описание участка</b> Поддерживает HTML-теги<br />')" onmousemove="move(event)" onmouseout="out()" href="#" />

<area shape="poly" coords="607,277,607,272,599,260,614,246,614,217,610,200,604,178,596,176,596,170,604,155,610,142,614,142,614,118,610,118,610,106,590,106,589,102,572,102,572,84,554,89,556,79,561,75,557,61,544,51,544,40,539,40,541,31,526,31,526,38,522,38,521,27,513,27,486,46,479,46,479,51,473,51,473,89,464,91,480,102,486,115,513,115,515,108,536,120,530,133,514,133,514,151,521,158,513,171,515,185,494,209,481,202,480,210,496,232,510,235,554,238,551,244,577,277,584,277,589,286,596,277,604,277" onmouseover="over('<b>Описание участка</b> Поддерживает HTML-теги<br />')" onmousemove="move(event)" onmouseout="out()" href="#" />
</map>


---------- Добавлено 15.07.2015 в 13:15 ----------

Крикну..., а в ответ тишина)

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий