CODEWITHSUNDEEP
javascriptjqueryhtml
Tom Rider
Tom Rider

Reputation: 2805

html-5 range slider max and min value

I am using html-5 slider 

      <input type="range" .. />

I want to slider's min and max values on its left and right side respectively . How can i do this?

Upvotes: 3

Views: 8241

Answers (2)

pozs
pozs

Reputation: 36214

If you want to display min and max values on its left and right, just print there:

10 <input type="range" min="10" max="20" /> 20

You could use css too, though its not widely supported.

input[type="range"]:before {
    content: attr(min) " ";
}
input[type="range"]:after {
    content: " " attr(max);
}

Upvotes: 2

Zoltan Toth
Zoltan Toth

Reputation: 47667

Try

<input type="range" min="20" max="80" />

DEMO

Also the following attributes can be applied to input type="range"

  • max - specifies the maximum value allowed
  • min - specifies the minimum value allowed
  • step - specifies the legal number intervals
  • value - specifies the default value

Upvotes: 3

Related Questions