CODEWITHSUNDEEP
jquery
martin
martin

Reputation: 11

fade out div when mouse is still

I've made a div show on mousemove. now I need it to fade out when mouse is not moving. I've tried this, but the problem is that when the div is in "fadeout-mood", it don't show again when I move the mouse.

is there someone who can help me with this?

$("#main_center").mousemove(function(){
    $("#menylist").show("");
    $("#menylist").fadeOut(5000);

the actual page is here: http://www.martinsorensson.com/porrmyr/index.php

Kindly Martin

Upvotes: 1

Views: 787

Answers (3)

Sarfraz
Sarfraz

Reputation: 382686

Missing brackets, try this out:

$("#main_center").mousemove(function(){ 
    $("#menylist").show("");
}); 
$("#menylist").fadeOut(5000);

or you may try this:

$("#main_center").mousemove(function(){
    $(this).fadeOut(1000, function() {
        $(this).remove();
    });
});

Upvotes: 0

Tom Bartel
Tom Bartel

Reputation: 2258

I think for what you want to do, you must also stop the fading animation on mouse motion:

$('#main_center').mousemove( function(e) {
    $('#menylist').stop().show();
    $('#menylist').fadeOut(5000);
});

Note the stop() call. Is this what you were looking for?

EDIT: David's solution is better than mine, because fadeOut() sets display to none, which probably is not what you want.

Upvotes: 0

David Hellsing
David Hellsing

Reputation: 108500

$("#main_center").mousemove(function(){
    $("#menylist").stop().show().css('opacity',1).animate({
        opacity: 0
    }, 5000);
});

Upvotes: 3

Related Questions