使用鼠標滾輪滾動不會觸發jQuery懸停或鼠標懸停

Question

我有一個無序列表，每個列表項目背景在鼠標懸停在其上時都會改變顏色。如果鼠標不移動並且滾輪向下滾動，則光標會懸浮在不同的列表項上，但通過jQuery的懸停類不會被觸發。爲什麼是這樣？我該如何解決問題？

這是代碼。

(function ($) { 
    Drupal.behaviors.jMapping = { 
    attach: function(context, settings) { 
     var jMap, 
      pointToMoveTo, 
      data, 
      bounds, 
      icon, 
      $el; 

     $('#map').height(200).jMapping({ 
     category_icon_options: { 
      'default': {color: '#7CDF65'} 
     } 
     }); 

     jMap = $('#map').data('jMapping'); 
     bounds = jMap.getBounds(); 

     $.each(jMap.gmarkers, function(id, marker){ 

     google.maps.event.addListener(marker, 'mouseover', function() { 
      $('#nid-' + id).addClass('hover'); 
     }); 
     google.maps.event.addListener(marker, 'mouseout', function() { 
      $('#nid-' + id).removeClass('hover'); 
     }); 
     }); 


     $("#map-side-bar li").mouseenter(function() { 

     $el = $(this); 
     data = $el.data('jmapping'); 

     if (!$el.hasClass("hover")) { 
      $el.addClass("hover"); 

      jMap.gmarkers[data.id].styleIcon.set("color", "#017DC3"); 
      pointToMoveTo = $.jMapping.makeGLatLng(data.point); 
      jMap.map.panTo(pointToMoveTo); 
     } 
     }).mouseleave(function() { 
     $("#map-side-bar li").removeClass("hover"); 
     jMap.gmarkers[data.id].styleIcon.set("color", "#7CDF65");  
     }); 
    } 
    }; 
})(jQuery); 

Answer 1

退房的mousewheel plugin由布蘭登·艾倫：

一個jQuery插件，增加了 跨瀏覽器的鼠標滾輪支持。

// using bind 
$('#my_elem').bind('mousewheel', function(event, delta) { 
    console.log(delta); 
}); 

// using the event helper 
$('#my_elem').mousewheel(function(event, delta) { 
    console.log(delta); 
}); 

Answer 2

看看這個，可能會解決這個問題。

how to highlight rows in a table on mouse hover ?