Styling HTML5's input range control with CSS?

Question

If so, how? I want to make the slider look like this: enter image description here

Which involves changing the color of the draggable dot and the slider bar, as well as changing their sizes. Any help would be appreciated.

I don't think that is possible. You might have to use jQuery UI or something similar. — Blender, Nov 20 '11 at 00:53
http://stackoverflow.com/questions/2979297/is-there-a-way-to-style-html5s-range-control — v42, Nov 20 '11 at 01:25

score 17 · Accepted Answer · answered Nov 20 '11 at 01:40

you can do it in WebKit for sure. here's a quick example: http://jsfiddle.net/jalbertbowdenii/7Nzgw/3/

pretty sure you can style cross-browser if you're using modernizr, @ least for modern browsers..but i am assuming. you can find more information here: http://davidbcalhoun.com/2011/implementing-iphone-slider-unlock-with-input-type-range

1 Answers1