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 3 of 3
  1. #1
    Regular Coder
    Join Date
    Aug 2010
    Posts
    408
    Thanks
    17
    Thanked 2 Times in 2 Posts

    mouseover/out issue

    I've added in a .filter to get rid of queued up mouseovers on an div, but now, if the user mouses out quickly enough, the image continues to get +10 larger without ever shrinking back down, like the mouseout says to. The problem is that there's a separate animation that makes the images a different size, so I'm trying to do this with a relative size with +=, -= and not set pixels.

    any thoughts?

    Code:
    $(".square.one,#link_nest").mouseenter(function(){
     
    	if ($(".the-nest")[0]){
    		$("#link_nest").css({color:"#153d53",fontWeight:"400"},100);
    		}
    	else{
    	
    		$(".square.one").filter(':not(:animated)').animate({width:"+=10px"},200);
    		$("#link_nest").css({color:"#153d53",fontWeight:"400"},100);
    		$("#square_caption1").css('visibility','visible');
    	} 
     });
      
      
     $(".square.one,#link_nest").mouseleave(function(){
    	if ($(".the-nest")[0]){
    		$("#link_nest").css({color:"black",fontFamily: "Source Sans Pro",fontWeight:"300"},100);
    	}
    	else{
        	$(".square.one").filter(':not(:animated)').animate({width:"-=10px"},200);
        	
        	$("#link_nest").css({color:"black",fontFamily: "Source Sans Pro",fontWeight:"300"},100);
        	$("#square_caption1").css('visibility','hidden');
        }
    
     });
    Last edited by turpentyne; 03-08-2013 at 07:55 PM.

  • #2
    New Coder
    Join Date
    Dec 2011
    Posts
    17
    Thanks
    3
    Thanked 0 Times in 0 Posts
    could something like below work?
    Code:
     $('#'+ divID).mouseenter(function(){
            
            $(".square.one").filter(':not(:animated)').animate({width:"+=10px"},200);
            //do something
        }).mouseleave(function(){
        	$(".square.one").stop(true) //removes animation in the queue
        	$(".square.one").filter(':not(:animated)').animate({width:"-=10px"},200);
    
               // do something
            });

  • #3
    Regular Coder
    Join Date
    Aug 2010
    Posts
    408
    Thanks
    17
    Thanked 2 Times in 2 Posts
    The image still gets bigger if I mouse-off quick enough to not register that I moused off of the image?


    I put in an alert test, and it does seem to register that I moused off, no matter how fast. But the animation doesn't seem to trigger - unless I go slow.
    Last edited by turpentyne; 03-11-2013 at 02:38 PM.


  •  

    Posting Permissions

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