Response title
This is preview!
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="timeline-box">
<input id="seekslider" type="range" min="0" max="100" value="0" step="1"><br>
</div>
**//jQuery to detect when user changes the timeline with the seekslider
$(document).ready(function(){
$("#seekslider").mouseup(function(e){
var leftOffset = e.pageX - $(this).offset().left;
var songPercents = leftOffset / $('#seekslider').width();
audio.currentTime = songPercents * audio.duration;
});
});**
//jQuery to detect when user changes the timeline with the seekslider
$(document).ready(function(){
$("#seekslider").on('mouseup touchend',function(e){
var leftOffset = e.pageX - $(this).offset().left;
var songPercents = leftOffset / $('#seekslider').width();
audio.currentTime = songPercents * audio.duration;
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="timeline-box">
<input id="seekslider" type="range" min="0" max="100" value="0" step="1"><br>
</div>
© 2013 jQuery Foundation
Sponsored by and others.