Share Posted May 17, 2022 Hi! I've made an SVG image with several different objects. The interaction would be this: - If you hover an element there would be a small effect on this element. (a scale, rotate and move depending on the mouse position.) - If you hover out the element get back to the original position. Currently, I have a problem with the targeting, the effect animates all the elements in the SVG. ...And some with the mouse position tracking:) How can I solve this? Thanks for the help in advance See the Pen ExQWZem by szsoma (@szsoma) on CodePen Link to comment Share on other sites More sharing options...
Share Posted May 17, 2022 Hi @soma Welcome to the forum. Probably easiest to create a tween for each one and play/reverse on mouseenter/leave. Maybe something like this. See the Pen 81af104f98ab206012f97eab84edc8b9 by PointC (@PointC) on CodePen Happy tweening and welcome aboard. 1 Link to comment Share on other sites More sharing options...
Author Share Posted May 17, 2022 Hi! Thanks for the quick answer. I think I just overcomplicated this issue 😅 1 Link to comment Share on other sites More sharing options...
Share Posted May 17, 2022 just sneaking in to say this pen is cute. 10/10 1 Link to comment Share on other sites More sharing options...
Share Posted May 17, 2022 Glad to help and don't worry about overcomplicating it. It happens to all of us. Happy tweening. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now