TimTh

Thank you, Jack. This is very helpful. It was the square bracket notation that I was missing. Your solution also works if I leave in the JQuery and just use square brackets with Flip.getState, which also eliminates the second Flip.from statement. I really appreciate your taking the time to code the answer for me! Awesome.

I am struggling to figure out how to write the most efficient code with toArray and FLIP and hoping someone can point me in the right direction. I'm using toArray to find all classes for a set of divs, then using FLIP to animate the contents of those divs via toggleclass on click. The contents are child elements, which I'm identifying within each instance using JQ find. My problem is that I'd like to write one Flip.getState, one toggleClass, and one Flip.from statement to cover all the child class animations, but my coding skills are too shaky to know how to do that since the class names are within the toArray. The linked CodePen is a working example using inefficient, duplicate statements, with a comment showing those I'd like to consolidate. Apologies, I know this is probably more of a pure JS/JQ question than GSAP-specific. Thank you!

This community is great, thanks all.

Thanks Cassie. I agree it is a tricky middle ground, so probably unrealistic. Just wishing! Good luck with your curation work and thanks again.

Fantastic, can't wait to dive into these. Thank you PointC.

Hey Cassie - Great suggestions, thank you! I will definitely dig into both. To answer your follow-up question, I was just searching Google, CodePen, the GSAP site, etc. for terms like "GSAP examples with code" or "best GSAP animations", or more specifically for things like "gsap photo gallery examples", etc. If I were to describe the ideal collection it would be: 1) Real life examples, from live commercial websites (i.e. not tutorials) 2) Linked to code so I can see how the magic was done - sort of how Webflow Showcase examples often link to cloneables. 3) Tagged by feature type rather than GSAP element. So for example cool animations for cards, great hero animations, creative button animations, amazing photo gallery animations, etc. rather than ScrollTrigger animations and Observer animations etc. Sort of the way the Relume library or Flowbase have their components categorized. Clearly my goal is to get inspired by and build off of others' best work - respectfully of course. And I'd be remiss if I didn't also say how completely frickin' awesome GSAP is and how much the community appreciates your contributions and those of others who put so much time into this forum. Thank you!

Does anyone know of a good place to go for a collection of inspirational GSAP examples, sort of a Behance for GreenSock, but with links to code? I'm hoping for something more detailed than GreenSock Showcase and more curated than just searching CodePen. Apologies if there is an obvious answer, I couldn't find anything amazing after a bit of searching. Thank you!

Awesome, thank you very much! It's nice to know I wasn't missing something syntactically and even better to have a workaround. Much appreciated!

Hi - When using the ScrollTo plugin I'd like to set the offset using vh instead of px, but offsetY seems to take only numeric values in pixels. offsetY: "5vh" or even offsetY: "20px" don't seem to work. Am I missing something, or if px is the only unit allowed with ScrollTo, is there a way to accomplish what I'm trying to do with a regular tween, without the ScrollTo plugin? Apologies if the answer is obvious/basic, I'm new to GSAP and didn't see anything on the forums or with a general google search. Thanks for any advice!