Make An Element Follow Your Mouse - jQuery mouseFollower

Make An Element Follow Your Mouse - jQuery mouseFollower

mouseFollower is a small jQuery plugin makes any element follow your mouse inside a specific container, with a smooth animation.

See also:

How to use it:

1. Add your element to a container element as this:

<div class="container">
  <span class="badge">Element</span>
</div>

2. Add jQuery library and the mouseFollower.js script to the web page.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous"></script>
<script src="jquery.mousefollower.js"></script>

3. Call the function on the container element and done.

$(function(){
   $('.container').mousefollower();
});

4. You are allowed to change the default CSS selector of the element which will move along with your mouse.

$(function(){
   $('.container').mousefollower({
     followerSelector: ".badge"
     
   });
});

This awesome jQuery plugin is developed by julien-its. For more Advanced Usages, please check the demo page or visit the official website.

  • Publication date: 22.03.2018
  • Source