我有一个标题在悬停时淡入,然后在鼠标离开时向下滑动。如何更改此设置,以便标题在 mouseenter 上从图像顶部向下滑动,然后在 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);
});
});