Jump to content


GSAP PinSpacing Issue with BS4 Accordion Dynamic height

Recommended Posts

I have defined some specific end value to the pinAnimation.  And the BS4 have accordion with dynamic content. Here the issue is, the scrollHeight is not being refreshed when accordion collapses. I tried using ScrollTrigger.refresh() but it's not solving the issue too. Is there anyway to refresh the scroll height dynamically.

See the Pen qByPZga?editors=1010 by devSanjay (@devSanjay) on CodePen

Link to comment
Share on other sites

It looks to me like the problem is that you're not waiting for the animation to finish before you call ScrollTrigger.refresh(). So when you call that, things are still at the old size. From what I can tell, you're not even using GSAP for those animations (if you were, you could do it in an onComplete callback), so you could use something like a setTimeout() that matches (or slightly exceeds) your CSS transitions or whatever you're using to do those animations, like: 

setTimeout(() => ScrollTrigger.refresh(), 500); // wait 500ms

Does that clear things up? 

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.