JSFiddle - React, Tailwind, and code Playground

HTML

<div id="play">Play</div>
<div id="bar"></div>
<div id="indicator"></div>

CSS

#play {
	position:absolute;
	left:45px; top:20px;
	cursor: pointer;
}

#bar{
	position:absolute;
	width:150px; height:4px;
	background-color:#999;
}

#indicator{
	position:absolute;
	width:0px; height:4px;
	background-color:#333;
}

JavaScript

$(function(){
    
  $("#play").click(function() {
	$("#indicator").animate({"width": "150px"}, 8400);
  });
    $('#bar').click(function(e) {
        var parentOffset = $(this).parent().offset();
         var relX = e.pageX - parentOffset.left;
        $("#indicator").animate({"width": relX + "px"});
    });
    
});