Jump to content
Search Community

mush

Members
  • Posts

    6
  • Joined

  • Last visited

Everything posted by mush

  1. Thanks for the reply @ZachSaucier I tried this but this is not the right solution. I should pin the section and run the animations with user scrolling and when the section's animations are done then the next section should appear. Your example is not pinning the sections and doesn't apply the revealing section transition. Check this video, see how the section is pinned and when the section animations are finished it revealing the next section. https://www.loom.com/share/787742767ae049feb237c0c630cad600
  2. Hey @ZachSaucier. I checked the demos in the ScrollTrigger docs but none of them worked with me. My problem is all of my sections have animations with pin scrolling, every section has its own timeline and when I add a new timeline to wrap all the timelines it gets crashed. Here a simple example of my code, how I can add the transitions in this demo? revealing sections from the bottom https://codepen.io/muhmushtaha/pen/ExPoxGq
  3. Hi guys, I built a page with multiple animations using GSAP and ScrollTrigger, this is the page Open Screenplay. The animations are very good but I need to add transitions between the sections but I don't how I can do it. The transitions that I need to apply are bounce transition like this https://connect-homes.com/process and overlap transition like this http://www.espn.com/espn/eticket/story?page=Dock-Ellis. Thanks in advance.
  4. mush

    Nextjs and gsap

    Hi @ZachSaucier I'm new to gsap world and I didn't know that there a plugin for triggering the scroll, I used it instead of scrollscene and it really cool and easy to use. You can take a look at the page that I did it using GSAP Open Screenplay. It still needs some improvements. Thank you.
  5. mush

    Nextjs and gsap

    Hi all, I did some animations with gsap and scrollscene and it working fine when I run the development environment but when I build the project and visit the page I get errors in the console. Uncaught TypeError: Cannot assign to read only property 'x' of object '#<HTMLImageElement>' I tried to add a polyfill like the scollscene docs say and I used next-transpile-modules and transpiled gsap like this but it didn't work. const withTM = require('next-transpile-modules')(['gsap']); Any suggestions?
×
×
  • Create New...