让:悬停过渡完成，即使不悬停在元素上

Question

我一直在这里建立一个摄影网站，但我在画廊页面中遇到了一个问题：悬停过渡。它加载两个覆盖缩略图的链接，一个在fancybox中打开图像，另一个将图像设置为背景。

一切都很好，但如果在过渡完成之前将光标悬停在缩略图上，则会将其动画设置回原始状态。

在恢复到空闲状态之前，有没有办法让转换结束？

Answer 1

假设JavaScript不是不可能的，那么jQuery肯定会让你使用.hooper（）方法接受两个回调的能力来实现这种行为，一个用于悬停，一个在悬停停止时。

$("div.thumb").hover(function(){
    // show the magnifying glasses
    $(this).animate({ top: "0", opacity: 1 });
}, function() {
    // hide the magnifying glasses
    $(this).animate({ top: "-100px", opacity: 0 });
});