jquery - 悬停后如何将元素移回其原始位置

Question

当另一个 div 使用以下代码悬停时，我试图将一个 div 向右移动 -

$('#boardpicture2').hover(function() {
     $('#boardpicture3').stop().animate({'margin-left': '100px'}, 1500);
});

但是如何在用户完成将鼠标悬停在 boardpicture2 上后让 div 回到原来的位置？有没有叫 unhover 什么的功能

谢谢你的帮助

Answer 1

.hover()有两个参数，第一个是 mouseenter 回调，第二个是 mouseleave 回调。如果未提供第二个回调，则在 mouseenter 和 mouseleave 事件上都调用第一个回调。

因此，您可以在第二个回调中添加取消悬停逻辑。

$('#boardpicture2').hover(function() {
     $('#boardpicture3').stop().animate({'margin-left': '100px'}, 1500);
}, function() {
     //your unhover logic
     $('#boardpicture3').stop().animate({'margin-left': '0'}, 1500);
});