Share Posted April 18, 2020 I'm just not sure if I still need Scrollmagic, as I haven't used GSAP in a really long time, and it seems (at least by looking) that you don't need SM to have simple .from() animations that say fade in a div from the left and from opacity 0 to 1 (like on the homepage elements as you scroll down). I'm setting up my dependencies, and just want to wrap my head around how to do it currently. Thanks in advance, and I apologize for my ignorance! Link to comment Share on other sites More sharing options...
Share Posted April 18, 2020 I personally use Intersection observer + gsap to create animation when user has scrolled to the targeted element. 2 Link to comment Share on other sites More sharing options...
Share Posted April 18, 2020 Hey jrhager84 and welcome to the GreenSock forums! GreenSock is actually working on a scrolling plugin that will enable you to easily do things like this. But until that's released, you can use intersection observers or attach to the scroll event. I cover how pair an animation with the scroll position in the section titled "Use case: Animating based on the scroll position" of this CSS-Tricks article (I recommend reading the whole thing). You can fire the whole animation at once as well if you'd prefer. For more about using intersection observers, see this article. 3 Link to comment Share on other sites More sharing options...
Author Share Posted April 18, 2020 So, the examples on the front page are using intersection observers? Or ScrollMagic? I just want fade-in animations to fire when the containers enter the screen, so that way I can animate sections when a user scrolls through the page. Which way is the easiest to set up? Thanks again! Link to comment Share on other sites More sharing options...
Share Posted April 18, 2020 4 minutes ago, jrhager84 said: the examples on the front page are using intersection observers? They currently use intersection observers. 5 minutes ago, jrhager84 said: I just want fade-in animations to fire when the containers enter the screen, so that way I can animate sections when a user scrolls through the page. Read the articles I linked to learn more about how to do it Link to comment Share on other sites More sharing options...
Author Share Posted April 18, 2020 15 minutes ago, ZachSaucier said: They currently use intersection observers. Read the articles I linked to learn more about how to do it I took a look, and it seems the Intersection Observers are what I'm looking for. I really do appreciate the help! Is there a timeline for the scroll addition to GSAP? Weeks? Months? I'm building a website, and just want to do a bit of 'forward-thinking' to incorporate that in the future. You guys rock! Link to comment Share on other sites More sharing options...
Share Posted April 18, 2020 45 minutes ago, jrhager84 said: Is there a timeline for the scroll addition to GSAP? Weeks? Months? Hopefully weeks 1 Link to comment Share on other sites More sharing options...
Share Posted May 3, 2020 On 4/18/2020 at 2:47 PM, ZachSaucier said: Hey jrhager84 and welcome to the GreenSock forums! GreenSock is actually working on a scrolling plugin that will enable you to easily do things like this. But until that's released, you can use intersection observers or attach to the scroll event. I cover how pair an animation with the scroll position in the section titled "Use case: Animating based on the scroll position" of this CSS-Tricks article (I recommend reading the whole thing). You can fire the whole animation at once as well if you'd prefer. For more about using intersection observers, see this article. Any info about this plugin? At least the name of it, so we can bother you guys with questions about it Link to comment Share on other sites More sharing options...
Share Posted May 4, 2020 15 hours ago, kohlej said: so we can bother you guys with questions about it You can just call it "the (GSAP) scroll plugin" for now. What questions do you have? Link to comment Share on other sites More sharing options...
Share Posted May 7, 2020 On 5/4/2020 at 2:45 PM, ZachSaucier said: You can just call it "the (GSAP) scroll plugin" for now. What questions do you have? Well I assume there is still no exact date of release, maybe what is it capable of doing? Can it animate elements on scroll, depending on scroll position, like we can do with ScrollMagic? Link to comment Share on other sites More sharing options...
Share Posted May 7, 2020 9 minutes ago, kohlej said: Can it animate elements on scroll, depending on scroll position, like we can do with ScrollMagic? That and more 2 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now