Как я могу изменить изображение с помощью onMouseOver для формы области? - PullRequest
0 голосов
/ 04 января 2012

У меня есть это:

<div class="map_container">

  <%= image_tag("maps/mainmap.png", :width => "450", :height => "450", :usemap => "#mainmap", :alt => "") %>  

  <map name="mainmap">

    <area shape="poly" 
      coords="158,43,152,49,164,86,165,112,153,153,139,169,145,236,201,241,202,251,166,253,142,257,132,294,102,269,85,240,68,227,53,213,28,202,27" alt=""
      onmouseover="document.body.style.cursor='pointer'" 
      onmouseout="document.body.style.cursor='default'" >
  </map>              
</div>

Что изменяет курсор, когда я перемещаю мышь на фигуру области, но как я могу изменить отображаемое изображение (mainmap.png)?

редактировать

Я пробовал следующее:

onmouseover="this.src='image2.png';", который не работает, но я могу только отобразить исходное изображение с помощью помощника rails image_tag, строка: <img src="maps/mainmap.png" width="450" height="450" usemap="#mainmap" alt=""> также не отображает изображение mainmap.png. Так это проблема с моим приложением, находящим каталог изображения?

Большое спасибо за любую помощь, она очень ценится.

1 Ответ

0 голосов
/ 06 января 2012

Я предполагаю, что вы не используете js framework, поэтому попробуйте это:

function changeImage(area) {
    var parent= area.parentNode, // Get the parent of area
        name = parent.getAttribute('name'), // Get the name attribute of the area which is same as the id of the image used
        img = document.getElementById(name); // Get the image obj

    img.src = "maps/newmap.png"; // Set the new image source
}
...