마우스 오버 및 마우스 아웃으로 이벤트가 계속 트리거됩니까?

Question

나는 마우스 오버시에 숨기고 싶은 둥지 div를 가지고 있으며, 마우스 아웃시에 보여줍니다.

그러나이를 시도하면 이벤트가 계속 발생합니다.

코드가 상당히 길어서 자세한 내용을보실 수 있습니다. 예 : 바이올렛을 확인하십시오 @http://jsfiddle.net/jWbZy/16/

Answer 1

여기에 그것을 할 수있는 방법 : 대신, 원하는 효과를 얻을 수있는 부모 요소에 이벤트를 추가

이 회전 목마 패널 주위에 래퍼를 추가하기 (내가 그 CP가 무엇의 약자인지 추측) : folowing 스타일

<div class="cpWrapper"> 
    <div class="cp"> 
     <div class="prev"></div> 
     <div class="next"></div> 
    </div> 
</div> 

:

.cpWrapper { 
    position: absolute; 
    width: 100%; 
    height: 100%; 
} 

그리고 숨기기/자식 elemen을 보여 TS : 여기

$('.slideshow .cpWrapper').mouseover(function() { 
    $(this).find('.cp').hide(); 
}); 
// ... 

근무 예 : 여기 ** http://jsfiddle.net/Kxvuk/

Answer 2

요소를 숨길 때 커서가 요소에 더 이상 없기 때문에 mouseout 이벤트도 발생하기 때문입니다.

$('.slideshow') 
    .mouseover(function(){ 
     $(this).find('.cp').hide(); 
    }) 
    .mouseout(function(){ 
     $(this).find('.cp').show(); 
    });