Using seek() and more

[silverdust]

In the linked pen, `.seek()` isn't doing what I'd have expected it to do which is jump to the exact scene with the given label. Maybe I'm doing something wrong.

This is also my first time structuring my GSAP animation with a master timeline and I know there are probably some things I'm doing wrong with that and some things generally wrong about my animation so I'm looking to get better suggestions/recommendations.

 

Thank you!

See the Pen wvvyywz by josephrexme (@josephrexme) on CodePen

[ZachSaucier]

Hey silverdust.

 

It seems to be seeking to the scene with the given label (the beginning of scene three). What scene were you expecting it to show?

[silverdust]

1 minute ago, ZachSaucier said:

Hey silverdust.

 

It seems to be seeking to the scene with the given label (the beginning of scene three). What scene were you expecting it to show?

Hey Zach, it starts the animation from `sceneOne` where the page is zoomed in. I thought `seek` should make it start at where the first screen just fades out -- the animation in `sceneThree` and then go on to the end. I could also use any tip you have to prevent the blur that happens on the SVG when zoomed.

[ZachSaucier]

1 minute ago, silverdust said:

it starts the animation from `sceneOne` where the page is zoomed in.

I'm not seeing this behavior. For me it starts with the fade out of scene 3. What browser are you in?

 

I'm guessing the pixelation of your SVG comes form scaling the DOM containers of your SVGs. Removing the following fixes the issue (but is obviously missing the effect that you're wanting):

tl.set(phone, {
  transform: 'translate3d(40.5vw, -20px, 700px)'
});

 

[silverdust]

I'm on Brave browser. I should try other browsers to see the behavior. That's odd and I thought I've been doing something wrong.

[ZachSaucier]

I see the same (correct) behavior in Brave for Mac. Not sure what's going on if it doesn't seek to that section for you.

[silverdust]

Hey @ZachSaucier, I tried this on Chrome too and had other people look at it. It starts for them on the first scene as well. It never jumps to third scene with seek. Could it be that I'm using an old version of GSAP? But you said it worked for you

[ZachSaucier]

It's possible that I'm misunderstanding you somehow. Here's what I'm seeing: 

 

[silverdust]

No you're right. That's what I hope to see but it's not what I see. Another friend tried on their computer and it wasn't what they saw either. It's odd. I don't know why that's not working for me/us

[ZachSaucier]

Maybe @GreenSock has seen something like this before? Are you on Windows?

[silverdust]

I'm on a macOS Mojave