Create Mouse Follow Elements With Configurable Resistance – FollowMe.js

The FollowMe.js JavaScript library lets you create interactive elements that move synchronously with your mouse.

How to use it:

Import the JavaScript file “FollowMe.js” into the document.

Give any element that you wish to add the Follow Mouse effect to a class of “Sheep”.

<div class="Sheep">
  Element Here
</div>

Add resistance to the object with the “data-resistance” attribute. So that the object follows your mouse at a slower speed.

If you give it a value of 1, the objects will follow your mouse at its exact speed. If you give it a 2, it will half that speed, and so on. If you’re looking for a very subtle shift of your elements, I’d recommend giving it a value of 200.

<div class="Sheep"
     data-resistance="60">
  Element Here
</div>

Changelog:

04/23/2021

• JS update

05/19/2019

• Added Inverse Follow