CSS3 Range Slider (Functional)
Update: I used some code from Rex's tutorial of styling the HTML5's range input through CSS3.
This is functional version of my CSS3 range slider that I posted some time ago. This version adds the ability to actually slide the range knob and it uses HTML5's range input element. Range inputs can be styled using CSS3 by using some webkit only properties. These includes -webkit-appearance which hides the original range slider and it's thumb when it's set to none, -webkit-slider-thumb which is the graphical thumb or knob that we can slide.
For the tooltip, output element is used which is again styled using CSS3 techniques and animated using transitions. Please note that it will only work on Webkit browsers. I hope othere browsers will also support this feature soon. Take a look at the source code to learn more about it.