user2636368
user2636368

Reputation: 632

how to move a element back to its original position after hover

Im trying to move a div to the right when another div is hovered using the following code -

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

but how do I make the div go back to its original place after the user finishes hovering over boardpicture2? Is there a function called unhover or something

Thanks for any help

Upvotes: 0

Views: 934

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388326

.hover() takes 2 parameters, first is the mouseenter callback and second mouseleave callback. If the second callback is not provided then the first callback is called on both mouseenter and mouseleave events.

So you can add the unhover logic in the second callback.

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

Upvotes: 2

Related Questions