JQuery는 여러 이미지의 마우스 오버시 가시성을 전환합니다.

Question

간단한 jquery 마우스 오버 기능에 문제가 있습니다.

나는 동적으로 생성 된 아이콘이 있는데, 마우스를 가져 가면 숨겨진 div가 표시되고 mouesout이 div를 숨길 것입니다.

<div class='lister1'> 
    <img src='"+path+stat1+"' /> 
    <img src='"+path+stat2+"' /> 
    <img src='"+path+stat3+"' /> 
    <img src='"+path+stat4+"' /> 
    <img src='"+path+stat5+"' /> 
    <img src='"+path+stat6+"' /> 
</div> 

JQuery와는 :

$('.hover_pop').hide(); 

$(document).on('hover','.lister1 img', function(){ 
$('.hover_pop').show(), function(){ 
    $('.hover_pop').hide(); 
} 
}); 

이 사업부를 보여줍니다하지만 불행히도 그것을 숨길하지 않습니다.

Answer 1

편집 끝에서 첫 번째 함수의 중괄호를 닫은

$(document).on('hover','.lister1 img', function(){ 
$('.hover_pop').show()}, function(){ 
    $('.hover_pop').hide(); 
}); 

이내 바보 같은 실수를 지적

$(document).on({ 
    mouseenter: function() { 
     $('.hover_pop').show() 
    }, 
    mouseleave: function() { 
     $('.hover_pop').hide() 
    } 
}, '.lister1 img'); 

Answer 2

시도 이전

사용 jQuery를 1.8으로

$(document).on({ 
    mouseover: function() { 
     $('.hover_pop').show() 
    }, 
    mouseout: function() { 
     $('.hover_pop').hide() 
    } 
}, '.lister1 img');​ 

DEMO HERE