Table Maker3schools TranslateImage CompressorFavicon Icon GeneratorCrop & Resize Image
Apu
Apu June 03, 2023 . #Attribute . #Element

How to set default value for range slider

In this article, we will discuss how to set default value for range slider. By default, the value of a range slider is 50. You can set default value for range slider using the value attribute.

<input type='range' value='24'>

The minimum value of input type='range' is 0 and the maximum value is 100. We can also set the minimum and the maximum value of the input slider 🎚️ adding the min and max attributes to the input type='range' element.

<input type='range' min='50'  max='250'>

Well, Let's see an example. Click on the Try it Yourself button to see how it works.

show input type range value
0
Try it Yourself »

How to set range slider value in javascript. #

To set range slider value, use the JavaScript value property. The example is given below.

<input type='range' min='50' max='250'>
<button onclick='myFunc()'>Change</button>
<script> 
  function myFunc(){
    document.querySelector('input').value = 72;
  }
</script>

Conclusion

In this article, you have learned How to set default value for range slider .

save
listen
AI Answer
Write Your Answer
loading
back
View All