Jump to content

Dravidra Pulka

How can I achieve this effect in codepen effect (canvas) with DOM elements. Please help. I'm very confused about the working of the code.

Go to solution Solved by StephanNijman,

Recommended Posts

To achieve this, you'll want to get the position of each circle and check that against the position of your cursor (or use a mouseEnter or mouseOver event listener), I think it'd be best to use something like quickTo to change position of the follow ring.


Docs on quickTo here:



  • Like 1
Link to comment
Share on other sites

Ooooh this is a fun one.

If you pop together a minimal demo with some HTML DOM elements and give it a go I reckon you'll have a bunch of people jump in to help you.

Link to comment
Share on other sites

This one I tweaked works!!! But there is a issue. Can anyone please tell me how can attract cursor only when the cursor is at the boundary. In the example it attract before entering the boundary.

See the Pen JjBwoBZ by sddvr (@sddvr) on CodePen

Link to comment
Share on other sites

That's a really nice solution and very readable! Thanks for contributing!

  • Like 1
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.