Jump to content
Search Community

Magnetic Hover Interaction with Cursor

Nikhil009 test
Moderator Tag

Recommended Posts

Is there a way to achieve the effect of mouse hover like on the website below:

 

https://studiomaertens.com/about

 

if you hover on the Work or About link, there is a magentic effect on it as well as the cursor automatically scales and positions itself in center with the link,

So far ive managed to combine two different examples together, the magnetic effect works but the cursor doesnt align properly with the

icons

 

 

Might there be a way to make a similar effect on the Studiomaertens website above.

Kindly let me know

Thank you

See the Pen by pen (@pen) on CodePen

Link to comment
Share on other sites

  • 2 weeks later...

Hello,


might anyone know why the cursor is is tweening only on the last element and not on the first two, i have added a for each loop on the targeted elements but yet only works on the last one. I think it might be the if condition although it is giving true outcomes.

See the Pen bGpWmXd by nikhil-ladhani-nl (@nikhil-ladhani-nl) on CodePen


 

Link to comment
Share on other sites

  • 1 year later...
On 9/7/2020 at 2:27 AM, Nikhil009 said:

Hello,


might anyone know why the cursor is is tweening only on the last element and not on the first two, i have added a for each loop on the targeted elements but yet only works on the last one. I think it might be the if condition although it is giving true outcomes.
 

 

 

 

Can anyone help with this? I'm having the same problem.

Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...