I have this code, which slides open a basket preview on a website I am working on. It stays open if the user is hovered on it, but I want it to have a two second delay before the callback for my hover is triggered. This is just in case the user didn't want the mouse to leave the basket area.
Below is the code I am using to animate the basket:
$('.cart_button, .cart_module').hover(function(){
$(".cart_module").stop().animate({top:'39px'},{duration:500});
}, function(){
$('.cart_module').stop().animate({top: -cartHeight},{duration:500})
});
Here is the code I tried to use, but had no affect:
$('.cart_button, .cart_module').hover(function(){
$(".cart_module").delay().animate({top:'39px'},{duration:500});
}, function(){
$('.cart_module').delay().animate({top: -cartHeight},{duration:500})
});
If you add the stop before the delay it works just fine:
$('.cart_button, .cart_module').hover(function() {
$('.cart_module').stop(true, true).delay(100).animate({top:'39px'}, 400);
},
function() {
$('.cart_module').stop(true, true).animate({top: -cartHeight}, 250);
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With