SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Arrow How to stop an animation loop in jquery

    I have a problem with the animation on this page "intervista 5"

    Practically, when the player is playing, next and prev arrows should be hidden. When the user hovers with the mouse on `div.interview_media` the function I created[1] shows current slide's active arrows.

    Now, the issue: if I hover `div.interview_media` from the right or the left side of the div, centrally (i.e. where the next or the prev arrow should be) the animation enters a loop since when the arrow is hidden, the pointer triggers the animation while, appearing the arrow, the pointer is no more on `div.interview_media` but on one of the arrow (`.browse`) so arrows are hidden entering, then, a show/hide loop… doh!

    Any idea on how to solve the issue?

    Thank you all for you help,
    Giuseppe

    [1] The show hide function:

    Code JavaScript:
    $(function(){
        $('.interview_media').hover(
            function(){
                console.log('showing arrows');
                $('.hidden').stop(true, true).show(200);
            },
            function(){
                console.log('hiding arrows');
                $('.hidden').stop(true, true).hide(200);
            }
        );
    });

  2. #2
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok, it seems that with just using fadeIn/Out functions the loop (most of the times. please, let me know how it works for you) is not triggered.
    I will also add hoverIntent to be sure the functions is triggered once the mouse is really hovering the div but I am still curious if there was a "correct" solution to the issue. Any idea?

    Thank you all anyway.

    Giuseppe

  3. #3
    SitePoint Member
    Join Date
    Jan 2007
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok, I took the pragmatic way I should had taken yesterday. I just moved next and prev arrows inside .interview_media. Time is precious.


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
  •