fd_alistair

Many thanks for getting back to me - The first option (the eventCallback) seems to work best, however I've updated the Pen to include the button which decreases the height - basically I need to warn the user when it gets to a certain percentage, the users clicks the 'empty button', the animation starts again and then I need to start the percentage detection process again. Thanks again

Hi there - I'm trying to detect the percentage progress of an animation so I can warn the user that it's nearly finished. I could do an onStart and combine it with a setTimeout, but hoping there was a better solution using just GSAP Any help would be appreciated

Hi there - is it possible to return my div to its initial start position once it has reached the end of the path? I would image this could be done with onComplete: but not sure how to do it. Basically I need the div to return to it's previous position so I can tell it to start again with a button press. Any help would be appreciated. Thanks

Legend! - thank you

Ok thanks - I had tried that previously...am I doing something wrong? : https://codepen.io/fuzzyduck/pen/YzaeaBG

Hi there, I've checked the documentation for MotionPath and can't see the ability to add a callback function for when the animation has completed?...ideally I'd like this to be called at the end of each loop. Any help would be appreciated. Regards Al

Ok thanks for getting back to me, looks very interesting. Looking at the documentation I can't see a way to stop the looping from top to bottom, is that possible? Also, is it possible to keep the multiple text animations within the sections, before moving on to the next section?

Hi there, we're using scrolltrigger to move though sections, within those sections there are multiple text boxes that are animated in. We're trying to get this work on a touch-screen device so the user cannot scroll automatically from the first to last section with a quick swipe....is there anyway of restricting this? Any help would be appreciated

Ok thanks! that certainly does the job. Kinda odd this isn't a feature of GSAP?

Hi there - I have set a min and max width on a div, however the code below constantly adds 100px to the divs width even though a maxWidth has been set in gsap and CSS, it stops at the correct width, but if you look at the code the width keeps on increasing. https://codepen.io/fuzzyduck/pen/XWVGVNj Any ideas please?

Ok thanks for your help

Thank you! - that's exactly what I needed to know, I will try other methods

Thanks...so basically just go read a book? - I'd really like to know if this is possible first as there is nothing in the examples you have shared which demonstrates this.

Hi there, I'm trying to build a game where you move an SVG up, down, left right, using cursor keys (let's say a blob), but when that blob touches the inner edge of another SVG (no matter what shape it is) it can no longer move beyond that edge. Just wondering if this is possible with GSAP? - I know you can do collision detections with outer edges of SVGs...but not sure if possible for an SVG within an SVG? Any help would be appreciated Thanks

Very nice - I'll study it

Hi there - I'm trying to simulate the slicing of vegetables with a downwards swipe and I'm really struggling to find a viable solution - I have had a look at the below post but it's not quite what I'm after. I need to have multiple points of swipe down, fix it so you can only go down (not back up) and then have an event once each one is complete. I believe this can be done with SVG masking what is the background (or chopping board) on top of the vegetable. Any help would be appreciated.

Thanks!

....just following up on this - I'm struggling to find a way to stop the animation - is it possible to create a 'stop' button which pauses & cancels the animation where it is?

Works a treat! many thanks

Hi there, I'm new to Greensock but managed to create a quick code pen. I've created an animation which goes from 500px to 0px over 10 seconds. I've created a button which adds 100px to the width on click, however if you click the button multiple times it looks like it queues the animation and takes too long to restart the animation. Any help would be appreciated.