Styling HTML5's input range control with CSS?

Question

If so, how? I want to make the slider look like this:

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

Answer 1

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