I want to stop animation onClick

[MarioBros]

Hi, I am trying to use gsap animation on my website. 

 

When user is scrolling down the animation is working as it should(pinned img) but how can I stop animation when user click Colours/Menu button and take him straight to the element skipping animation section? 

 

I tried couple of solutions but nothing is working for me. 

 

Demo

 

Thank you for any help!

 

 

[Rodrigo]

Hi,

 

Your demo is a bit difficult to follow as I had to go through every single file trying to find where exactly the pertinent GSAP code is. In the future please do your best to simplify your examples to one or two files or point us directly to where we should be looking.

 

You have this in your helper function:

element.scrollIntoView({ behavior: 'smooth' });

So that will do a smooth scroll to the position the top of that element is. I tried removing it without any success and then tried the ScrollTo plugin using a set instance and that didn't work neither. Strangely enough it does work in this example:

See the Pen oNJZXwX by GreenSock (@GreenSock) on CodePen

 

Honestly I couldn't tell you without diving into every file of the project and creating a similar project locally to test. Unfortunately we don't have the time resources to provide free general consulting for our users. You can contact us for that type of work or post in the Jobs & Freelance forums in order to get help there.

 

Hopefully this helps.

Happy Tweening!