Can I Make A Range Input's Value Step Up And Down On Click?
Say I have an . If I focus the input, then move up and down with the keyboard, the value changes accordingly. When I click an arbitra
Solution 1:
You can do something like this.
<!DOCTYPE html><script>var oldValue = 50; </script><inputtype=rangemax=100step=1oninput=" if (oldValue) { this.value = this.value > oldValue ? oldValue + 1 : oldValue - 1; } oldValue = parseInt(this.value, 10);">Solution 2:
I just made it for you:
$("#rangecontainer").mousedown(function(event){
event.preventDefault();
var rangeInput = $(this).children();
var actualValue = parseInt(rangeInput.val());
if(event.pageX > (rangeInput.position().left + 15 + actualValue)){
rangeInput.val(actualValue+1);
}
else{
rangeInput.val(actualValue-1);
}
});<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="rangecontainer"><inputtype="range"min="0"max="100"step="1" /></div>Edit: By adding 15px to the left you avoid the position balancer bug
Post a Comment for "Can I Make A Range Input's Value Step Up And Down On Click?"