[elem]

Hi guys,

I've got a simple jQuery dropdown div, which fades in once you put your mouse over a certain button, and then fades away after the mouse is away. Since I don't like it to disappear instantly, I've put a delay on the fade out effect. It's all good, but my only problem appears when you move your mouse away and then move it back quickly, it would disappear and then appear again, instead of staying on all the time (I thought delay would stop the fade out effect from happening for that 1 sec, but it just ... delays it suprisingly lol).

So my quesiton is - how can I make that div stay for 1 second and not fade out if the mouse is back over it during that 1 second period? Here's my simple code:

$(".basket-preview").hide();
	$("#basket").mouseenter(function() {
		$(".basket-preview").fadeIn(300);	
	});
	$("#basket").mouseleave(function() {
		$(".basket-preview").delay(1000).fadeOut(300);
	});