CODEWITHSUNDEEP
javascriptjquery
Pooja
Pooja

Reputation: 796

div fades out if mouse does not hover over it

I want code in which a div fades out if mouse does not hover over it. This is the code which makes the div visible. As soon as it is displayed it fades out. I want that if a user hovers over it while it is fading out it stops fading and becoming as it was initially. And then as user hovers out of it it fades again.

$('#popuup_div').css({left:leftVal,top:topVal}).show().fadeOut(2000);

Upvotes: 0

Views: 502

Answers (2)

Ahamed Mustafa M
Ahamed Mustafa M

Reputation: 3139

Check this fiddle. http://jsfiddle.net/6WMDz/1/

$('#popuup_div').on('mouseover', function() {
     $(this).fadeIn();
});

​

I have used mouseover to fadeIn the div. You can also use stop, but it is not resetting the display to initial state.

Upvotes: 0

J.P.
J.P.

Reputation: 5745

jQuery has a stop() function which stops all animations taking place on an element. Use it in a mouseover() event handler and you're done.

Upvotes: 1

Related Questions