jQuery mouseenter/mouseeout 효과 - 첫 번째 호버가 아닌 경우

Question

jQuery로 간단한 호버 효과를 만들 수 있다고 생각했습니다.

jQuery('.has-children').on({ 
    mouseenter: function() { 
      jQuery(this).find('.sub-menu').fadeIn(); 
     }, 
    mouseleave: function() { 
      jQuery(this).find('.sub-menu').fadeOut(); 
     } 
}); 

전체 코드 : 페이지 호버 효과를로드 한 후 http://jsfiddle.net/cachaito/R5qnt/2/

처음 페이드없이, 그냥 일반 CSS 호버하지만이 코드로 이상한 행동을합니다. 다음은 마침내 jQuery 페이드와 함께합니다. 누구나 나에게 설명해 줄 수 있니?

UPDATE

I도의 jQuery .hover()와 함께 시도 .fadeToggle(); 하지만 이상한뿐만 아니라 동작하며 도리어 작동합니다 mosueenter는 hidding .SUB 메뉴이며하는 MouseLeave 콘텐츠를 공개한다 : -/

jQuery('.has-children').hover(function() { 
    jQuery(this).find('.sub-menu').stop(true, true).fadeToggle(); 
}); 

전체 코드 : http://jsfiddle.net/cachaito/R5qnt/5/

Answer 1

귀하의 CSS는 display: block을 설정 :hover 있습니다. 즉, 컬렉션에서 먼저 hide()으로 전화해야합니다.

jsFiddle.