PinSpacing fix

[Dennyno]

Hi folks,

since a while I don't touch GSAP, sadly.

I making a reveal section, but I was trying to get a height which might be less than 100vh or 100svh (example 60vh) and on mobile I end to get a huge white pinspacing before seeing the next black section placeholder.

If setting pinspacing false, I cant see all timelines animations.

Which is the right way, as I can't remember?

Setting 100vh (or 100svh) of course the problem goes way, as on my demo)...

Thanks for any hint, as usual

 

See the Pen ExMeBvE by DedaloD (@DedaloD) on CodePen

[Rodrigo]

Hi,

 

I assume that you mean each <section> element being less than 100vh(svh), the only solution for that is to wrap those elements around an extra one and pin that extra parent element.

 

Here are a few demos for that:

See the Pen LYMYYEL by GreenSock (@GreenSock) on CodePen

 

See the Pen qBLRzVX by GreenSock (@GreenSock) on CodePen

 

See the Pen ZEVpqjb by GreenSock (@GreenSock) on CodePen

 

Hopefully this helps.

Happy Tweening!

[GreenSock]

Yep. I assume you wanted something like this?: 

See the Pen VwREZpM?editors=1010 by GreenSock (@GreenSock) on CodePen

[Dennyno]

11 hours ago, GreenSock said:

Yep. I assume you wanted something like this?: 

 

 

Thanks a lot,totally forgot about the pin