Jump to content


Scrolltrigger won't update start/end position on height change

Moderator Tag

Recommended Posts

Hello fellow members,

I am trying to refresh Scrolltrigger on this tween but the start/end positions of the each img are not updating after height change of previous img.

am i doing the refresh wrong or is there an easier way to achieve this? 

See the Pen bGxvVGx by hamadarabi (@hamadarabi) on CodePen

Link to comment
Share on other sites



If you add this to your configuration you'll see where the problem lays:

onUpdate: () => {
  console.log("update", Date.now());

You're creating an endless loop. I strongly recommend you against calling ScrollTrigger's refresh method on any GSAP update callback, it could lead to a situation like this and most likely really bad performance. If I was you I'd make the images containers height fixed and not depending on the image's height, then make the height of the image responsive and animate it's scale from a smaller value. Sure the effect looks great but it opens a huge can of worms.


Hopefully this helps.

Happy Tweening!

  • Like 2
Link to comment
Share on other sites

  • 2 weeks later...

thank you @Rodrigo , i didn't use the animation after all, it didn't make sense to me if they cant change heights.

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.