I'm currently trying to use the new FLIP plugin to add an animation to my filter script. I tried to do something similar like this how-to demo:
See the Pen NWRxarv by GreenSock (@GreenSock) on CodePen
…but with two filters that can be combined.
I just can't get the animation to work properly. Most of the time the to-be-hidden elements don't get any animation. I feel like I'm 90% there but something's missin
Yep, the core issue is that when the child elements get set to position: absolute, the container is collapsing. One solution would be to just set an explicit height. And of course we'd have to animate that since it'll change based on the filters. Here's a fork:
See the Pen c0311da91ea4d96722eea42384f45712 by GreenSock (@GreenSock) on CodePen
Notice I'm just grabbing the height before we make changes (startHeight), then after we make our changes (