Jquery：圖像地圖區域上的鼠標懸停事件

Question

我試圖對圖像地圖區域的鼠標懸停執行操作。這是我的HTML：

<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是唯一首次啓動區域，而不是其他人。任何幫助將不勝感激。

謝謝。

Answer 1

我只是想你的代碼在Safari，它工作得如預期。 2個獨立的區域提供單獨的警報。其中一個警告「qdk」和其他「未定義」，因爲您沒有第二張地圖的ID屬性。

Answer 2

你試過使用懸停嗎？

例如從jQuery的網站...

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