Jump to content
Search Community

Start and stop a gsap slideshow on fullscreen.js scroll

msnl test
Moderator Tag

Recommended Posts

Hi,

 

first of all, i'm a very basic user, so i apologize for the silly question. That's also the reason my codepen is not working, somehow if i try to fire fullpage.js in plain javascript it doesn't work there, and i think that also messes up the other fading animations are not working as intended, but that's not relevant, i think it shows enough.

Anyway, i've found on this forum a snippet for a slideshow and i'm trying to implement it with fullscreen.js. It was a tweenMax, if that matters. I'm trying to make the slideshow stop when changing section and either resume or restart when going back to it as i don't like the idea of a random animation timing when going back.

 

The problem is that i'm not sure what's the best way to do it, if i try to use gsap 3  and turn the slideshow in a timeline it just fires as soon as the variable is declared and i can't seem to control it with fullpage onLeave, if i declare everything inside the onLeave bracket i can't seem to access it later.

 

How do i proceed?
 

See the Pen zYvdKWv by msnl (@msnl) on CodePen

Link to comment
Share on other sites

Hey msnl and welcome to the GreenSock forums!

 

Why use fullpage.js when you can just use GSAP? The thread below shows how you can do full page snapping sections with just GSAP:

 

With that being said, when it comes to controlling the slideshow you shouldn't be using a setInterval. You can't really control a setInterval properly. What you should be using instead is a GSAP timeline! Controlling sequences of animations is exactly what it's intended for. 

 

Here's how I'd set it up:

See the Pen WNQERJZ?editors=0010 by GreenSock (@GreenSock) on CodePen

 

highly recommend going through our getting started page, our page on the position parameter, and my article on animating efficiently. Those resources should answer most of your questions, but feel free to ask if you are having trouble with something.

Happy tweening :) 

  • Like 3
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...