Jquery 이벤트가 스태킹을 계속하고 이전 이벤트가 완료 될 때까지 시작되지 않습니다.

Question

아래 코드는 기본적으로 모든 이미지를 연락처 클래스에서 70 %까지 페이드합니다. 그리고 나서 호버링 할 때 여러 개에 걸쳐 마우스를 가져 가면 불투명도가 100 %로 변경됩니다. 이미지 또는 다중 호버 이벤트가 발생하면 모든 이벤트가 스택되고 이전 이벤트가 완료 될 때까지 다음 이벤트가 시작되지 않습니다.

$(".contact img").fadeTo("slow", 0.7); 
$(".contact img").hover(function(){ 
    var titleID = $(this).attr('id'); 
    $("#" + titleID).fadeTo("fast", 1); 
},function(){ 
    var titleID = $(this).attr('id'); 
    $("#" + titleID).fadeTo("slow", 0.7); // This sets the opacity back to 60% on mouseout 
}); 

모든 도움을 주시면 감사하겠습니다.

감사합니다.

Answer 1

애니메이션이 대기열에 있습니다. 현재 애니메이션을 중단하려면, .stop()^[docs] 전화 :

$(this).stop().fadeTo("fast", 1); 

을 @ 리차드가 자신의 코멘트에 언급, 당신은 단지 $(this)를 사용할 수 있습니다 보인다. 당신이하고있는 일은 현재 요소의 ID를 얻은 다음 jQuery가 선택자로 그 요소를 찾도록합니다. 하지만 이미 요소에 대한 참조가 있습니다 ...