DOM element's style doesn't stay what I set it to after the gsap.to function completes.

[Bimal Pandey]

So I have this setup and whenever I hover over the div with class "skills__text__container__Main__langs", I want it increase cursor element's width and height but as soon as the function completes it returns back to its initial style.

See the Pen vYWZvao by bimalpandeycode (@bimalpandeycode) on CodePen

[Bimal Pandey]

I got it to work on my current project by adding

width:${hasHovered?"100px":"0px"} height:${hasHovered?"100px":"0px"}`

this line of code in line 19 of the codepen but not on codepen.

Edited February 12, 2022 by Bimal Pandey
spelling error

[nico fonseca]

Hey @Bimal Pandey you can use the same tween and play with the reverse and play methods to show and hide the cursor.
I made a Codepen for you so you can see the example in action 🙌

See the Pen 8dca6234eee2852316e898382b34b303 by nicofonseca (@nicofonseca) on CodePen

 

PS: To follow the cursor you can use the method quickSetter() for a boosted performance 

 

Happy tween 🎉