SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    May 2007
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Post stop() isn't preventing my animation from quing up and I'm not sure why

    I'm new to JQuery and basically I know enough to get into trouble but not to get out of it. Here I know that stop() should stop an item from queing an animation, but maybe I have it in the wrong place. Not sure.

    Code:
    $('.image').hover(
        function(){ $(this).stop().find('.up').fadeOut().end().find('.over').fadeIn();},  
        function(){ $(this).stop().find('.over').fadeOut().end().find('.up').fadeIn();}
    );
    The code involves a simple image swap. In the HTML there are two images and in the CSS, one image is set to display:none. This bit of JQuery fades in the hidden image on a hover event. The problem is that even with the stop command, if the user runs their mouse over it a number of times, the animation will keep queing up over and over again, making the effect look broken.

    I also tried {queue: false} and that didn't seem to work either. If anybody has any ideas about why this isn't working, I'd love to hear them.

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,705
    Mentioned
    102 Post(s)
    Tagged
    4 Thread(s)
    The stop command applies to the element on which it is called.
    You'll have to apply stop() to the 'up' or 'over' elements instead, since those are the elements that are actually being animated.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Member
    Join Date
    May 2007
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, I guess I'm going to have to re-think this because putting stop in those positions is making it act very odd. the icons end up disappearing completely after the third or fourth hover. I just don't get this stuff.


Tags for this Thread

Bookmarks

Posting Permissions

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