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 に答える