So I set a border on the edges of the div so you can see its limit. The problem is: the interaction is not ending when I move the mouse out of the div, only way after it. Does anyone know why this happens and how to fix this?
PS: I know this composition differs from how you build a custom cursor which you use a position fixed div and everything, this one I know how to do it. My build is different, I’m also using % instead of vw, to make the interaction work based on the div size.
The thing is, if I target the hover at the emoji, I don’t have a way to move it left and right properly. At least I did not find the “right” way to do it. Do you know how to set it up properly? I changed the animation on the emoji instead of the wrapper in the designer, if you can check it.
The second solution works almost perfectly though with overlow: hidden, if anything, I will use the second option, in case there is no better way to do this. Thanks for your time.
Yeah i know what you mean… I would go for the second solution and maybe set the smoothing at the animation to 0… so you dont see it sliding from the “Resting state” to your mouse position…