JSFiddle - React, Tailwind, and code Playground

HTML

<div class="row" id="rowek">
  	<div class="col-md-12 rowek-bgr">
			<div class="col-md-2 child">
				<span class="child-txt">Test</span> <span class="child-special-txt">for adults</span>
			</div>
			<div class="col-md-2 child">
				<span class="child-txt">Test</span> <span class="child-special-txt">for childrens</span>
			</div>
			<div class="col-md-2 child">
				<span class="child-txt">Test</span> <span class="child-special-txt">for students</span>
			</div>
			<div class="col-md-2 child">
				<span class="child-txt">Test</span> <span class="child-special-txt">for grands</span>
			</div>
  	</div>
  </div>
  
    <div id="follower">
  <div id="circle1"></div>
  <div id="circle2"></div>
</div>

CSS

.rowek-bgr {
	background-color: #313343;
	display: flex;
	justify-content: center;
}

.child {
	padding: 15px;
	width: auto!important;
}

.child-txt {
	font-size: 18px;
	font-weight: 300;
	text-transform: uppercase;
	color: white;
}

.child-special-txt {
	font-size: 18px;
	font-weight: 800;
	text-transform: uppercase;
	color: white;
}

#follower {
  position: absolute;
  top: 50%;
  left: 50%;
	display: none;
}


#follower #circle1 {
  position: absolute;
  -webkit-animation: pulse 2s infinite; /* Chrome, Safari, Opera */
  animation: pulse 2s infinite;
  background: #fff;
  border-radius: 50%;
  height: 0em;
  width: 0em;
  margin-top: 0em;
  margin-left: 0em;
}
#follower #circle2 {
  position: absolute;
  -webkit-animation: pulse 4s infinite; /* Chrome, Safari, Opera */
  animation: pulse 4s infinite;
  background: rgba(200,0,0,0.8);
  border-radius: 50%;
  height: 0em;
  width: 0em;
  margin-top: 0em;
  margin-left: 0em;
}
@-moz-keyframes pulse {
  0% {
    opacity: 0.2;
    height: 1em;
    width: 1em;
    margin-top: -0.5em;
    margin-left: -0.5em;
  }
  50% {
    opacity: 0.9;
    height: 3em;
    width: 3em;
    margin-top: -1.5em;
    margin-left: -1.5em;
  }
  100% {
    opacity: 0.2;
    height: 1em;
    width: 1em;
    margin-top: -0.5em;
    margin-left: -0.5em;
  }
}
@-webkit-keyframes pulse {
  0% {
    opacity: 0.2;
    height: 1em;
    width: 1em;
    margin-top: -0.5em;
    margin-left: -0.5em;
  }
  50% {
    opacity: 0.9;
    height: 3em;
    width: 3em;
    margin-top: -1.5em;
    margin-left: -1.5em;
  }
  100% {
    opacity: 0.2;
    height: 1em;
    width: 1em;
    margin-top: -0.5em;
    margin-left: -0.5em;
  }
}
@-o-keyframes pulse {
  0% {
    opacity: 0.2;
    height: 1em;
    width: 1em;
    margin-top: -0.5em;
    margin-left: -0.5em;
  }
  50% {
    opacity: 0.9;
    height: 3em;
    width: 3em;
    margin-top: -1.5em;
    margin-left: -1.5em;
  }
  100% {
    opacity: 0.2;
    height: 1em;
    width: 1em;
    margin-top: -0.5em;
 ...

JavaScript

$(document).ready(function(){
 $( "#rowek" )
  .mouseenter(function(event) {
	   $("#follower").show();
  })
  .mouseleave(function() {
	   $("#follower").hide();
  });
												
							 });
               
               	$(document).ready(function(){
				(function() {
  var follower, init, mouseX, mouseY, positionElement, printout, timer;

  follower = document.getElementById('follower');

  printout = document.getElementById('printout');

  mouseX = (event) => {
    return event.pageX;
  };

  mouseY = (event) => {
    return event.pageY;
  };
					
					

  positionElement = (event) => {
    var mouse;
    mouse = {
      x: mouseX(event),
      y: mouseY(event)
    };
    follower.style.top = mouse.y + 'px';
    return follower.style.left = mouse.x + 'px';
  };

  timer = false;

  window.onmousemove = init = (event) => {
    var _event;
    _event = event;
    return timer = setTimeout(() => {
      return positionElement(_event);
    }, 1);
  };

}).call(this);
});