I started using GSAP couple of months back, but this animation seems to be a bit difficult to me, I hope some one has any idea with the following one.
I would like the code a gallery animation, but I have some issues with the onUpdate function.
First of all all items starts with the same height which set in css, then on click all goes bigger and the clicked one goes to the center, the previous one to the left, and next one to the right. ( and if you click on the selected one again then it zoomed back to the initial position )
The only way I could make this work is to use onUpdate ( setItemPosition ) and loop through the items and set left position for each one, which is unnecessary, I guess, but I don't know any better solution right now.
Then I wanted to add content to item which comes in once the animation finished, then when you click on the next item, the content disappears then go to next item then its content comes in, but because the main animation and the left position works onUpdate it just delays and breaks the tween.
So the item content doesn't disappear on transitioning between items. And the zoomed in and out animation seems delayed and broken. When you click on an item it should move and grow at the same time. At the moment move then grow.