HTML5 Input Type Range

Test Your Skill

Q. Which of the following input type was not introduced with HTML5.
URLSearchmultipleEmail

View all questions...

HTML5 Input Type Range

HTML5 comes up with a new input type range. This is very much similar to input type number. This new input type displays range in form of sidebar. It has attribute such as min, max value and step. If not specified explicitly, min value is set to 0 and max is set to 100. You can always override these min and max values. You can also specify the step value.

Attributes(value=[number])	Description
Min	Minimum accepted value for the input field
Max	Maximum value for the input field
Step	Legal interval value i.e. if step = 2 possible value for the are all number in range of max and min with value%2 = 0
Value	This is default value associated with input field.
Placeholder(value=[text])	Hint text associated with input field

<html>

<head>

function a() {

alert(document.getElementById("aa").value);

}

</script>

</head>

<body>

<div>

If your browser support range input type you will see a silder

</div>

<br />

<br />

To view how attribute step work set min=0 and max=20 and step=5 and see how slider

move.

</div>

</body>

</html>

Try it yourself

<< Previous

Next >>

Add Comment

Comment

Name
(Required)

E-mail (Privacy assured)
(Required)

Subscribe to this site by email

Test Your Skill

HTML5 Input Type Range

Add Comment

Poll of the Day

Related Contents

Online Test Papers

Related Tutorials

Fun @ Work

Top Blogs