Jump to content
GreenSock

Joostan

BusinessGreen
  • Posts

    12
  • Joined

  • Last visited

Posts posted by Joostan

  1. Apologies, i should have just posted it the first off but was trying to save time.

     

    Here is the pen. 

     

    If i click around on the buttons quick enough elements get left on the stage, because the new tween starts before the end of the previous.

     

     

    See the Pen eMPMOP by Joostan-33 (@Joostan-33) on CodePen

     

     

     

     

  2. Thanks for your feedback.

     

    I agree with your comment "unresponsive to user clicks".  So what is the best practice approach so that the user is not restricted and the tweened elements are not left stranded on the "stage" obstructing the incoming tween, because a new animation was called.  ...thinking.

     

    Would it be something like:

    ----------------------

    -many

    -different

    -tweens

    -...

    ----------------------

    buttons <1> <2> <3> <....

    ---------------------

    button.clickEvent -> creates timeline and add that tween

     

    If another button was clicked it is added to the timeline, in a queue. The user would still have to wait to see the effect of that last clickEvent.

     

    Hmmm, maybe if a button was clicked during a tween, stop that tween immediately and somehow clear all elements, then start then last chosen tween.

     

    I'd be interested in your thoughts.

     

     

  3. Hello there,

     

    How do i check isActive() across ALL timelines so that i can prevent further animations running until all is NOT active.

     

    I have forked pen "check isActive()" to help illustrate my case as seen below but do not know how to proceed.

     

    I am:

    - using an object organise my timelines.

    - trying to prevent multiple animations occurring simultaneously from user input selection.

     

    I have also looked at this gsap post which looks like the user solved a similar issue but was not documented.

     

    Many thanks

      

    Joostan

     

     

    See the Pen zWmPwV by Joostan-33 (@Joostan-33) on CodePen

  4. Good afternoon,

    imagine a number of elements that need to be tweened onto 'stage' and off 'stage' depending on the user selection.

     

    • How on earth do make a call to a timeline in a function from a number of buttons?
    • Maybe there is a better approach to my attempt in the pen line 65.

     

    Thank you for taking the time to look at this post.

     

    See the Pen qoxRYv by Joostan-33 (@Joostan-33) on CodePen

     

     

     

    See the Pen qoxRYv by Joostan-33 (@Joostan-33) on CodePen

  5. Thanks taking the time to reply, and your great GSAP tool.

     

    The pause, invalidate & restart works well. Pen updated.

    I will experiment further with the pause invalidate().restart but it is good to hear that its fine to call it all from the click() handler.

     

    I just find javascript so unruley!

     

     

     

    • Like 1
  6. Hello,

     

    i have a scenario, where i wish to animate elements from the last position to the new one depending on a large set of button options.

     

    How do i make make code modular so not have the timeline in the click event function. Please see pen.

    See the Pen owVVoo by Joostan-33 (@Joostan-33) on CodePen

  7. Hello tweeners,

     

    drawSVG - circle

     

    I'm getting the reverse behaviour on IE in contrast to Chrome and FF.

    In my simple example Chrome and FF animate leaving a "u" shape, while in IE leaves a "n" shape.

     

    Any work-a-rounds?

     

    Regards

    Joostan 

    See the Pen PmxVWp by Joostan-33 (@Joostan-33) on CodePen

  8. Good morning people,

     

    Could somebody explain why the 'strokeDashoffset' in the following pen will not animate?

     

     

    Inspecting the element in the DOM and manually manipulating the 'stroke-dashoffet' i can easily animate property.

     

    images attached.

     

    Thanks

     

     

     

    post-44139-0-92122000-1473121202_thumb.png

    post-44139-0-70452100-1473121210_thumb.png

    See the Pen kkYEpk by Joostan-33 (@Joostan-33) on CodePen

    • Like 2
×