Jump to content
Search Community

Handling multiples start/end marks

Willy Christian test
Moderator Tag

Go to solution Solved by PointC,

Recommended Posts

Hello guys! I would like to ask you for a tip/help with this situation (codepen). I have an animation that has a different position depending on the screen size. So I would like to have multiple start/end positions for each breakpoint. However, when I set matchMedia(), it looks like gsap is keeping the previous points instead of killing it (as I read in the docs) which is causing interference in the timeline. Maybe I just misunderstood the correct way to use it or I just didn't fully understand how to use the library.

See the Pen wvyrKao?editors=0010 by willychristian (@willychristian) on CodePen

Link to comment
Share on other sites

Hello @PointC (and anyone else)
I would like to ask something else...
I'm working this implementation on a Web site (witch is Drupal) and it doesn't  have the same behavior as in the codepen (and I have no idea why)...
If I implement as you show me, it works when I load the page but when I resize the page, the breakpoints set to handle it seems not working, because the animation crashes.
Any idea/tip that I could try to solve it ?

Link to comment
Share on other sites

hmmm... I'm not familiar with Drupal at all. If you can reproduce it in a CodePen, I'm sure we can help.

 

You're using the latest versions of GSAP and ScrollTrigger, correct?

 

I'd try removing one of the media queries from the three you're using just to see if one is the culprit. (typo or otherwise). 

  • Like 1
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...