JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <link rel="stylesheet" type="text/css" href="styles.css">
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
  <script src="js.js"></script>
 </head> 
 
<body>
    <div id="container">
    
        <div id="block">
            <div></div>
            <div></div>
            <div></div>
        </div>
        
        <div id="button">ЫЫЫЫЫЫ</div>
        
        
    </div>
 </body> 
</html>

CSS

#block div{
    width: 100px; 
    height: 100px;
    float: left;
    margin:50px;
    background: lightgreen;
}

#button{
    position:absolute;
}

JavaScript

$(function () {   

  wW = $('#block').width();
  oL = $('#block').offset().left;
  fW = $('#button').width();

  $('#block').mousemove(function(e){
    x = e.pageX-fW/2;

    if (x >= wW+oL-fW) {x = wW+oL-fW;};
    if (x <= oL) {x = oL;};
   
    $('#button').css('left', x);
  });

});