Limit a "range" using another "range"

Question

Limit a "range" using another "range"

Navigation

#1 by (1 votes)

0

Hello, I'm developing a web page, and I need to limit a range by using another range.

I have two <input type='range' /> both go from 0 to 10. I need that when one is changed to the value 5 the other receives a total value of 5.

html jquery

asked by anonymous 09.10.2017 / 15:58

1 answer

I want to save in a new txt file a copy of another txt in Python How to save form in android studio and send pro firebase

score 1 · Accepted Answer

Good using your comment

I have 2 two "range" the two go from 0 to 10, but I need it when one at 5 the other was limited to at most 5

I've developed a response that uses Jquery and satisfies your question.

$('.slider1').on('input', function(){
	$('.range1').html($('.slider1').val());
	$('.slider2').attr('max', $('.slider1').val());
});
$('.slider2').on('input', function(){
  $('.range2').html($('.slider2').val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><h4>Rangequedefineatéondepodeirooutrorange</h4><inputtype="range" min="1" max="10" value="0.01" id="myTime" class="slider1">
<br>
Valor do primeiro range: <span class='range1'>1</span>
<br>
<h4>O range abaixo tem um valor máximo definido pelo range acima</h4>
<input type="range" min="1" max="10" value="0.01" id="myTime" class="slider2">
<br>
Valor do segundo range: <span class='range2'>1</span>

When the first range changes, the second range will always receive the current value of the first range as the maximum value.