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

看看这个，可能会解决问题。

how to highlight rows in a table on mouse hover ?

Answer 2

查看Brandon Aaron的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);
});

使用鼠标滚轮滚动不会触发jQuery悬停或鼠标悬停

2 个答案: