JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//code.jquery.com/jquery-latest.min.js"></script>
<link href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css' rel='stylesheet' type='text/css'>
<div style="width:20%;padding-top: 20%;position:relative;color: white;display:inline-block;border-style:solid;border-color:white;" oncontextmenu="return false" class='disable-selection noIbar' unselectable='on' onselectstart='return false;' onmousedown='return false;'>
  <div class="a" id="a" style="width:100%;height:100%;top:0px;left:0px; position:absolute">

  </div>
  <div class="a1" id="a1" style="width:100%;height:100%;top:0px;left:0px; position:absolute">
    <div id="tracker1">
    </div>
  </div>
</div>
<br>
<div style="width:20%;padding-top: 20%;position:relative;color: white;display:inline-block;border-style:solid;border-color:white;" oncontextmenu="return false" class='disable-selection noIbar' unselectable='on' onselectstart='return false;' onmousedown='return false;'>
  <div class="b" id="b" style="width:100%;height:100%;top:0px;left:0px; position:absolute">

  </div>
  <div class="b1" id="b1" style="width:100%;height:100%;top:0px;left:0px; position:absolute">
    <div id="tracker2">
    </div>
  </div>
</div>
<div style="width:20%;padding-top: 20%;position:relative;color: white;display:inline-block;border-style:solid;border-color:white;" oncontextmenu="return false" class='disable-selection noIbar' unselectable='on' onselectstart='return false;' onmousedown='return false;'>
  <div class="c" id="c" style="width:100%;height:100%;top:0px;left:0px; position:absolute">

  </div>
  <div class="c1" id="c1" style="width:100%;height:100%;top:0px;left:0px; position:absolute">
    <div id="tracker3">
    </div>
  </div>
</div>

CSS

#tracker1 {
  width: 4px;
  height: 4px;
  position: absolute;
  background: red;
  border-radius: 5px;
}

#tracker2 {
  width: 4px;
  height: 4px;
  position: absolute;
  background: red;
  border-radius: 5px;
}

#tracker3 {
  width: 4px;
  height: 4px;
  position: absolute;
  background: red;
  border-radius: 5px;
}

JavaScript

$(a1).mousemove(function(event) {
   var x = event.pageX;
   var y = event.pageY;
   var absolutePositionx = x - $('#a1').offset().left;
   var absolutePositiony = y - $('#a1').offset().top;

   $("#tracker1").css({
     left: absolutePositionx,
     top: absolutePositiony
   });
   $("#tracker2").css({
     left: absolutePositionx,
     top: absolutePositiony
   });
   $("#tracker3").css({
     left: absolutePositionx,
     top: absolutePositiony
   });

   //     console.log(absolutePositionx+":"+absolutePositiony);
 });