ScrollSmoother image height calculation for data-speed

[morituro 0 Likes (Newbie)]

hi,

please help me. I can't figure out, how to calculate the minimum height of an image with data-speed 0.9. The image is in a container with a size of 500px and should never be cropped. If I increase the height of the image by 10% to 110% then the image still crops on larger screens. The screen height is also relevant.

Can anybody help?

thank you, bye

[PointC 14,465 Likes (Superhero)]

I don't follow what you're asking. Are you talking about a parallax effect. If so, you want the child larger than the container and set the speed to auto. From the docs:

"auto" speed

When you set the speed to "auto", it will calculate how far it can move inside its parent container in the direction of the largest gap (up or down). So it's perfect for parallax effects - just make the child larger than its parent, align it where you want it (typically its top edge at the top of the container, or the bottom edge at the bottom of the container) and let ScrollSmoother do its magic. Obviously set overflow: hidden on the parent so it clips the child.

 

If that's not what you meant, could you please provide a minimal demo? Thanks and happy tweening.

[morituro 0 Likes (Newbie)]

thank you!! speed auto works perfect for me. sorry for the stupid question 🙈 I misunderstood the docs...