Aureliano Capri

Thank you so much Cassie. While I was waiting answers on this thread, I also found some good references in the syntax: - mouseMove - event.PageX - event.PageY - gsap.to($cursor, { Now I'll add to my list also gsap.ticker()! I hope to give you good updates.

Hi, the header on this website is my main reference: https://www.apple.com/go/iwd2020/ Is it designed with GSAP? If yes, are there some examples similar to this? If not, how do you call this kind of effect? (I tried to explain it in the title) I honestly miss the right definition for looking for the right tutorial/documentation. Sorry if it could seem off topic. Bye Aureliano

Thank you so much _Greg_, unfortunatly I hadn't enough coding basis for creating a sketch on Codepen. I will try to follow your suggestions. The codepen example that you sent me was already inspiring.

Hi _Greg_ thank you for your precious suggestions. Do you have any advice about HOW doing it with GSAP?

Hi, my name is Aureliano and it's my first time in GSAP. I am designer, but I collaborate with a coder. I am here because I would like to understand mechanics behind an animation that I would like to develop in GSAP with my partner (in crime). Attached you found a test that I did with Slider Revolution (I tried Smart Slider too) and effect sounds "good". I want to realize a pattern made by three types of squares (120x120, 256x256, 392x392 pixel) - gutter in rows and columns is always 16. Pattern should translate to the left. Every square will have a content inside (Image or GIF). Some of them will be hoverable and the translation should stop in case of hover. Hoverable squares links to an another page. When MouseLeave, translation start again. The entire animation is in loop. GSAPpers, is it possibile to realize something like this in GSAP? Thank you in advance for the interest, if you like my idea. Bye Aureliano test-animation-squares-diagonal.mp4