以下のコードを検討してください。
$(function() {
$('a').hover(function(e) {
$("#large").stop().css('display','none').slideDown(1000);
}, function(){
$("#large").stop(false,true).slideUp(1000);
});
});
アンカーがホバーされると、コードに従って img が下にスライドしますが、mouseleave イベントが発生するとすぐに img がスライドしますが、その後再びアンカーの上にホバーすると、img のサイズが縮小します。 .
これはcss部分です:
img#large{
padding: .5em;
background: #e3e3e3;
border: 5px solid #BFBFBF;
}
a{
position:absolute;
top:500px;
left:10px;
}