0

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

});
4

1 回答 1

1

试试这个:

$('div.wrapper').mouseenter(function(){    
    $(this).children('.description').stop().slideDown(700);  
}).mouseleave(function(){  
    $(this).children('.description').stop().slideUp(700);  
});
于 2012-09-13T22:30:32.373 回答