jQuery는 event_jquery를 전달하는 마우스의 지연된 처리 효과를 구현합니다.

JQuery 마우스 오버(hover) 이벤트 지연 처리, 구체적인 JS 코드는 다음과 같습니다.

(function($){ 
  $.fn.hoverDelay = function(options){ 
    var defaults = { 
      hoverDuring: 200, 
      outDuring: 200, 
      hoverEvent: function(){ 
        $.noop(); 
      }, 
      outEvent: function(){ 
        $.noop(); 
      } 
    }; 
    var sets = $.extend(defaults,options || {}); 
    var hoverTimer, outTimer; 
    return $(this).each(function(){ 
      $(this).hover(function(){ 
        clearTimeout(outTimer); 
        hoverTimer = setTimeout(sets.hoverEvent, sets.hoverDuring); 
      },function(){ 
        clearTimeout(hoverTimer); 
        outTimer = setTimeout(sets.outEvent, sets.outDuring); 
      }); 
    }); 
  } 
})(jQuery); 

hoverDelay 메소드에는 4개의 매개변수가 있으며 이는 다음을 의미합니다.
hoverDuring 마우스 통과 지연 시간
아웃 중 마우스 아웃 지연 시간
hoverEvent 마우스가 지나간 후 ​​실행되는 메소드
outEvent       마우스가 밖으로 나갈 때 실행되는 메소드
이 기능의 목적은 마우스 통과 이벤트를 분리하고 지연 및 지연 삭제를 이 방법으로 해결한 것입니다. 여러분이 해야 할 일은 지연 시간과 해당 마우스 통과 또는 제거 이벤트를 설정하는 것뿐입니다. 다음과 같이 의 간단한 예를 들어보겠습니다.

$("#test").hoverDelay({ 
  hoverDuring: 1000, 
  outDuring: 1000, 
  hoverEvent: function(){ 
    $("#tm").show(); 
  }, 
  outEvent: function(){ 
    $("#tm").hide(); 
  } 
}); 

다음은 좀 더 간결한 사례입니다.

$("#test").hoverDelay({ 
  hoverEvent: function(){ 
    alert("经过 我！"); 
  } 
});

은 id 테스트가 있는 요소가 마우스가 해당 요소 위로 지나간 후 ​​200밀리초 후에 "Pass me!"라는 텍스트가 포함된 팝업 상자를 표시한다는 의미입니다.

이상은 jQuery 마우스 오버(hover) 이벤트의 지연 처리에 관한 내용입니다. 모두의 학습에 도움이 되기를 바랍니다.