2012-02-20 5 views
2

jQuery 호버 호의 다양한 다른 게시물을 읽는 동안 잠시 보냈으며, jQuery 호버 기능이 제대로 작동하지 않게하기 위해 여러 가지 시도를했습니다. 내가 숨기기/jQuery의 호버 이벤트가있는 리튬 요소 내의 사업부를 표시 할이상한 jQuery 호버 동작

를 달성하기 위해 노력하고있어

.

사업부를 무슨 일

이 /가 제대로 표시 숨 깁니다 만, 마우스 다음, 때로는 숨기기 (하는 MouseLeave) 한 리튬 요소에서 매우 빠르게 이동하는 경우 실제로 실행되지 않을 것으로 보인다. 이렇게하면 숨겨져 있어야하는 div가 표시됩니다.

데모 데모

http://jsfiddle.net/vJPNT/11/

, 당신은이 효과를 볼 수 있습니다. li 요소 위에 마우스를 올리면 "Delete"링크가 포함 된 div가 나타납니다. 그러나 마우스가 다음 li 요소로 빠르게 이동하면 항상 사라지지는 않습니다.

추가 정보가 필요한 경우 알려주십시오. 감사.

+0

+1 우수한 문제 정교화 –

답변

2

두 기능에 console.log ($ (e.target))를 추가했습니다. e.target은 li 요소 내부의 div 중 하나입니다. 전파 된 호버 (hover) 이벤트를 잡았 기 때문일 수 있습니다.

$ (e.target)을 $ (이)로 변경하면 정상이어야합니다.

function updateIn(e) { 
    $(this).find('.actions').show();     
    console.log($(e.target)); 
} 

function updateOut(e) { 
    $(this).find('.actions').hide(); 
    console.log($(e.target)); 
} 

$('li.update').hover(updateIn, updateOut); 
$('li.update .actions').hide(); 
+1

같은 글을 써야했다. 여기에 바이올린이 있습니다. http://jsfiddle.net/vJPNT/26/ –

+0

도움을 주셔서 감사합니다! – crush

2
function updateIn(e) { 
    $(this).find('.actions').show(); 
    $(this).siblings().find('.actions').hide(); 
} 

function updateOut(e) { 
    $(this).find('.actions').hide(); 
} 

$('li.update').hover(updateIn, updateOut); 
$('li.update .actions').hide(); 

모든 새로운 updateIn 전에는 표시된 다른 동작을 숨겨야합니다.

+1

e.target을 사용하는 것이 현명하지 않다는 점 (Jørgen이 언급 한 바 있음) 외에도 귀하의 제안은 안전한 결정 임에도 불구하고 매우 효율적이지 않습니다. –

+0

@ TJ. 나는 그의 대답을 놓쳤으므로 요 르겐이 대답 한 것처럼이 반응을 쓰고 있었을 것입니다. 이 방법이 가장 효율적인 방법은 아니라고 생각합니다.하지만 형제가 많지 않은 한이 방법은 매우 안전하며 사용자 시스템의 약간의 오버 헤드보다 중요 할 수 있습니다. –

+0

나는 당신과 절대적으로 동의합니다. –

0

이벤트는 differents 요소에서 발생합니다. 찾기 기능은 .update 클래스 개체 만 반환합니다. .update