2011-08-08 6 views
5

이미지 맵 영역의 마우스 오버시 동작을 수행하려고합니다. 여기 내 HTML입니다 : 여기Jquery : 이미지지도 영역의 mouseover 이벤트

<img src="img/denisanddavid-bkgd.jpg" alt="Denis and David - web development and solution" width="1024" height="1299" border="0" usemap="#bkgdMap" id="bkgd" /> 
    <map name="bkgdMap" id="bkgdMap"> 
     <area shape="rect" coords="12,161,341,379" href="#" alt="qdk" id="qdk" class="mapping" /> 
     <area shape="rect" coords="347,162,675,379" href="#" alt="gifgif" alt="gifgif" class="mapping" /> 
    </map> 

그리고 내 JS :

$('.mapping').mouseover(function() { 

    alert($(this).attr('id')); 

}).mouseout(function(){ 
    alert('Mouseout....');  
}); 

나는 이유를 이해하지 않지만, JQuery와는 다른 사람을 첫 번째 영역에 대한 출시되지 않습니다. 어떤 도움이라도 대단히 감사하겠습니다.

감사합니다.

답변

4

난 그냥 사파리에서 코드를 시도하고 의도 한대로 작동합니다. 별도의 경고를주는 2 개의 별도 영역. 하나는 두 번째 맵에 대한 ID 속성이 없기 때문에 "qdk"및 기타 "정의되지 않은"것을 경고합니다.

+0

좋은 캐치, 나는 심지어 신분증을 보지 못했다 :) 슬픈 일은 이전에 나 자신을 태웠다는 것이다. – Mfoo

0

호버를 사용해 보셨습니까?

JQuery와 사이트에서 예 ...

$("td").hover(
    function() { 
    $(this).addClass("hover"); 
    }, 
    function() { 
    $(this).removeClass("hover"); 
    } 
);