Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Sep 2011
    Posts
    35
    Thanks
    18
    Thanked 1 Time in 1 Post

    Question jQuery fadeOut - how to delay and stop it if mouse enters again

    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:

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

  • #2
    New Coder
    Join Date
    Dec 2012
    Location
    Ingerlund
    Posts
    66
    Thanks
    8
    Thanked 4 Times in 4 Posts
    Hi!

    I think this is what you are looking for. Take out the JQuery hide and change your the basket-preview div to display:none in CSS. This should now work if I understand what it is you want


    Code:
    $("#basket").mouseenter(function() {   
    		$(".basket-preview").fadeIn(300);       
    });
    
    $("#basket").mouseleave(function() {
        if($(".basket-preview").css('display') !== 'none')
            $(".basket-preview").fadeOut(300);
    });

    EDIT: Don't waste your time. This doesn't work for what you want. I just read your post properly.
    Last edited by Entity_; 02-21-2013 at 06:12 PM.

  • Users who have thanked Entity_ for this post:

    elem (02-21-2013)

  • #3
    New Coder
    Join Date
    Sep 2011
    Posts
    35
    Thanks
    18
    Thanked 1 Time in 1 Post

    Thumbs up

    Quote Originally Posted by Entity_ View Post
    Don't waste your time. This doesn't work for what you want. I just read your post properly.
    Lol, thanks for being honest though ;]

  • #4
    New Coder
    Join Date
    Sep 2011
    Posts
    35
    Thanks
    18
    Thanked 1 Time in 1 Post
    does anyone know how to overcome that problem?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •