There is a block:

<div class="data-bottom"> <div class="container"> <div class="row"> <p>CLOVER FOUND © 2001-2018 / Все права защищены.</p> <a href="lsweb.ru">Сайт разработан студией LiteSite</a> </div> </div> </div> 

It is necessary to make the elements <p /> and <a /> move depending on the position of the cursor on the page.

Example:

enter image description here
https://exmo.com/

  • in order to track the mouse entry into the necessary block, it is necessary to hang up the handler on the mouseenter mouseleave event for this block. - Dmytryk
  • the block turns out this data-bottom and already "<p> </ p>" and "<a> </a>" to move like on exmo.com - Aslero
  • I have not found where and what moves there. Either the script did not load. I have a 3G - Dmytryk
  • when on the main picture you drive with a mouse, the animation moves depending on the position of the mouse - Aslero
  • there this block is animated <canvas class = "pg-canvas" style = "display: block;" width = "1343" height = "495"> </ canvas> - Aslero

1 answer 1

To track the mouse entry into the necessary block, you need to hang the handler on the mouseenter mouseleave event for this block.

 var cont = document.getElementById("cont"); cont.addEventListener("mouseenter", mouseenter); cont.removeEventListener("mouseleave", mouseenter); function mouseenter(){ console.log("mouseenter"); } 
 <div class="data-bottom"> <div class="container" > <div id="cont" class="row" style="width:200px; height: 200px; border: 1px solid "> <p>CLOVER FOUND © 2001-2018 / Все права защищены.</p> <a href="lsweb.ru">Сайт разработан студией LiteSite</a> </div> </div> </div>