jquery - ホバー後に要素を元の位置に戻す方法

Question

次のコードを使用して、別のdivがホバーされているときにdivを右に移動しようとしています-

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

しかし、ユーザーがboardpicture2にカーソルを合わせた後、divを元の場所に戻すにはどうすればよいですか? unhoverとかいう機能はありますか

助けてくれてありがとう

Answer 1

.hover()は 2 つのパラメーターを受け取ります。1 つ目は mouseenter コールバックで、2 つ目は mouseleave コールバックです。2 番目のコールバックが提供されていない場合、最初のコールバックが mouseenter イベントと mouseleave イベントの両方で呼び出されます。

したがって、2 番目のコールバックに unhover ロジックを追加できます。

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