[There is a bug that returns to start when resizing with scrollTrigger.]

Thanks for the detailed explanation.

I understood what you explained, and I too have tried to record the progress of the ScrollTrigger instance and get the scroll position of the new ScrollTrigger instance when the MatchMedia breakpoint is crossed, and scroll to that specific position I have also tried to get the scroll position of the new ScrollTrigger instance and scroll to that specific position, but it is not working at the moment.

 

I look forward to your good report.

[There is a bug that returns to start when resizing with scrollTrigger.]

Sorry. It still had extra stuff on it.

The problem this time is that it goes back to the beginning of the MAP when it gets smaller than the breakpoints set in matchmedia.

If the window is smaller than 910px or 767px.
It goes back to the beginning of the MAP even if it is in the middle of the timeline.

How can I maintain the timeline even when the window is smaller than the breakpoint?

[There is a bug that returns to start when resizing with scrollTrigger.]

It appears that the code was not working properly.
How can I eliminate the resizing bug in this animation?

 

See the Pen xxmVNxg by zumi999 (@zumi999) on CodePen

[There is a bug that returns to start when resizing with scrollTrigger.]

12 hours ago, GreenSock said:

 did you try following the directions we've provided twice now? Your demo still has the timeline being created OUTSIDE the matchMedia. 

 

 

I made the same mistake when I was rebuilding it. My apologies.
I fixed codepen but the same bug is still there.

 

See the Pen dywGVEE by zumi999 (@zumi999) on CodePen

[There is a bug that returns to start when resizing with scrollTrigger.]

On 8/25/2023 at 7:23 AM, Rodrigo said:

here is any chance that you could simplify your demo? Is a bit too much code and makes it a bit hard to follow.

 

Keep in mind that Jack suggested to create the timeline instance inside the MatchMedia instance:

Sorry, I wrote code that was hard to read.
I rewrote it simply.

In this case, you can also change the window width in the Image(class:travel-story) part
It goes back to the beginning of the map animation when the breakpoint is exceeded

See the Pen dywGVEE by zumi999 (@zumi999) on CodePen

[There is a bug that returns to start when resizing with scrollTrigger.]

On 8/21/2023 at 12:04 AM, GreenSock said:

I’m away from my computer so I can’t dig deep on this, but it looks to me like you are creating your timeline and ScrollTrigger OUTSIDE of your matchMedia(), so they won’t get reverted when the matchMedia() no longer matches. I would strongly recommend creating your timeline INSIDE the matchMedia(). 

Thank you for your response.
I have tried the timeline inside matchMedia() as you suggested, but the bug is not improved.
What is not good?
 

[There is a bug that returns to start when resizing with scrollTrigger.]

Hello.
I am Japanese and I am writing this question using a translation app. Therefore, please understand that I may not be able to convey the intent of your question well.

 

I think you can see the results of codepen,
This scrolltrigger's timeline reverts to the start of the animation when it is resized. Also, when resizing from mobile size to PC size, the screen does not resize, only the white margin expands.

 

Presumably, this phenomenon occurs when the width exceeds the width specified in matchmedia.

 

How can I resize it so it doesn't bug me?

 

*I would appreciate it if you could answer in sentences that are easy to translate.

See the Pen jOXOjdP by zumi999 (@zumi999) on CodePen