2 Replies Latest reply on Feb 2, 2015 10:11 PM by Keysaw

    Animation issue Firefox - unwanted loop

    Keysaw Level 1

      Hello!

       

      I have a symbol in my main timeline. Inside this symbol, I have 4 rectangles with a simple scale animation for every one of them.

       

      I would like to play this animation on hover state of this symbol. To do so, I added this simple code to the Mouseenter event of my symbol:

      // Show the button lines
      sym.$("sym_button_lines_03").stop().fadeIn(600);
      
      // Play the button lines animation
      sym.getSymbol("sym_button_lines_03").play("Start");
      
      

      I just added the same kind of code on the Mouseleave event, with fadeOut() and playReverse().

       

       

      Obviously it works just fine on Google Chrome, but it gets really complicated on Mozilla (and of course it works absolutely not in IE, but I don't care).

       

      On Mozilla, when the animation plays, it shows the first half-second of the animation, and then plays it in loop several times, from the beginning. Like if the animation get "stuck" and start over again and again.

       

      Something a little bit weird: If I remove 3 rectangles from the symbol and let the first one as he was, the animation works well. And when I add another one, it doesn't work anymore... like if they was to heavy for Mozilla (but they're just simple transparent rectangles...)

       

      Sounds it familiar to you? Is there something I can do to prevent this, like hiding some elements if the user uses Firefox?

       

      I don't know if I'm clear, thank you for your help.