jQuery 지연이 마우스 아웃에서 작동하지 않습니다.

Question

왜이 기능이 작동하지 않는지 설명 할 수 있습니까?

jQuery('.right-et-tooltip').delay(800).mouseout(function(){ 
     jQuery(this).find('.right-et-tooltip-box').animate({ opacity: 'hide', left: '-100px' }, 30); 
}); 

전혀 지연이 없습니다. 마우스가 꺼지 자마자 붐이 사라집니다.

감사합니다. 몇 가지 시도해 봤지만 너무 실망했습니다.

Answer 1

지연은 jQuery 선택기에 바인딩 되었기 때문에 아무 것도하지 않고 mouseout 핸들러 내의 함수가 아닙니다.

이 대신 ... 적용되는 보정

jQuery('.right-et-tooltip').mouseout(function(){ 
     jQuery(this).find('.right-et-tooltip-box').delay(800).animate({ opacity: 'hide', left: '-100px' }, 30); 
}); 

귀하의 jsFiddle ...

http://jsfiddle.net/zGtBN/2/

---

EDIT (보조 노트) 시도 :

을

우리에게 훨씬 좋을 것입니다. 마우스가 움직이는 동안 빠른 깜박임을 유발하는 경향이있는 mouseover & mouseout 방법이 아닌 mouseenter & mouseleave 방법을 사용하십시오. 여기 .hover() 방법에 insterted

Then you can simply combine the mouseenter and mouseleave handlers into one by using the jQuery .hover() method.

귀하의 똑같은 두 가지 기능 ...

http://jsfiddle.net/zGtBN/3/

---

편집 2 : 당신이 때

전에 다시 입력 떠나는 애니메이션이 완료되고, 애니메이션이 완성됩니다. 내가 대기열에있어. 실제로 &을 여러 번 열어두면 정지하기 전에 모든 애니메이션을 깜박 거리게 할 수 있습니다.

최대 적재하고 온다 새로운 문제를 만들지 애니메이션 대기열을 방지하기 위해 온/오프 mouseenter시 mouseleave 지연이 같은 mouseenter 기능에 대한 use a jQuery .stop(true, false) ...의

jQuery(this).find('.right-et-tooltip-box').stop(true,false).animate({ opacity: 'show', left: '-100px' }, 30); 

때문에, mouseleave 애니메이션을 즉시 중지합니다. "clearQueue"옵션에있는 true 옵션은 애니메이션 대기열을 지우고 "jumpToEnd"옵션에있는 false 옵션은 현재 애니메이션을 즉시 완료하는 대신 중지시킵니다.

수정 데모 ...

http://jsfiddle.net/zGtBN/4/