How can i add a label for the slider with <label...>

I love them only hated that you used a onchange for it, i'm using these on a website now but wanted the values to change while moving the slider.
So i wrote some custom JQuery to do this:

$('input[name="range"]').on("change mousemove", function() {
$(this).next().html($(this).val() + '%');
});

I will definitely favorite this snippet ! Thanks for building it !!!

The classic way to do this is to use "oninput" instead of "onchange".
And yes, I tried it in FF, chrome...

Looks even great in old SAFARI 5.1 !

not working in IE latest

I really didn't think it would work in older versions IE, but I hoped it would have at least worked in IE11

Works with Chrome and Safari on Mac OS X 10.9

Firefox doesn't style the actual ranges though.

Yeah, I tried to add the code, that was supposed to make it support Firefox, but it appears I either did it wrong or Firefox wont let me style it. :(

it’s ::moz-range-thumb there

Those are sliders not range selectors. :) But great work!

I called them a range selector due to the fact this is what HTML5 calls them. Take a look at the html, the type is "range". I do understand what you mean though.