JSFiddle - React, Tailwind, and code Playground

by surfine

HTML

<input type="range" id="points" value="50" min="10" max="100" step="1" />
<input type="button" id="plus" class="rangeMover" value="+" />
<input type="button" id="minus" class="rangeMover" value="-" />

JavaScript

var interval;

$('#plus').on('mousedown', function() {
    startTime(true); // to work on click also
  interval =  setInterval(function(){startTime(true);}, 500);
});

$('#minus').on('mousedown', function() {
    startTime(false); // to work on click also
  interval =  setInterval(function(){startTime(false);}, 500);
});

$('.rangeMover').on('mouseup', function() {
  clearInterval(interval);
});

function startTime(plus) {
	var oldvalue = parseInt($('#points').val());
    if (plus) {
        $('#points').val(oldvalue + 5).change();
    } else {
    	$('#points').val(oldvalue -  5).change();
    }
      console.log($('#points').val());
}