호버 위에서 이미지 캡션 슬라이드

Question

마우스를 가져 가면 가리킨 다음 페이드 인하는 캡션이 있습니다. 캡션이 마우스 센터의 이미지 위에서 아래로 슬라이드 한 다음 다시 mouseleave에서 위로 움직일 수 있도록 어떻게 변경합니까?

<a href="link.html"> 
    <div class='wrapper'> 
     <img alt="" width="184" height="69" src="image.png" /> 
     <div class="description"> 
      <div class="description_content">Title<br /><small>Description text</small></div> 
     </div> 
    </div> 
</a> 

JQuery와

$(window).load(function(){ 
     $('div.description').each(function(){ 
     $(this).css('opacity', 0); 
     $(this).css('width', $(this).siblings('img').width()); 
     $(this).parent().css('width', $(this).siblings('img').width()); 
     $(this).css('display', 'block'); 
    }); 

$('div.wrapper').mouseenter(function(){  
    $(this).children('.description').stop().fadeTo(700, 1); 
}).mouseleave(function(){ 
    $(this).children('.description').stop().slideUp(700); 
}); 

}); 

Answer 1

이 시도 :

$('div.wrapper').mouseenter(function(){  
    $(this).children('.description').stop().slideDown(700); 
}).mouseleave(function(){ 
    $(this).children('.description').stop().slideUp(700); 
});