HTML5 input type range from positive to negative

You could simply switch the limits and multiply the value by -1:

<input  type="range" min="-8" max='13' value="1" step="1" id="slider" >

$('#slider').change(function(){
    var val = -+($(this).val());
    console.log(val);
});

If you'll need the value to be submitted, copy it to a hidden field, and use that on server-side instead of the original.

A live demo at jsFiddle.


This slider will be reversed: min(left) is 8 and max(right) is -13, i think this is what you wanted... and step=-1 don't works.

HTML:

<input type="range" min="-13" max="8" value="1" step="1" id="range"/>

css:

#range{
    transform: rotateY(180deg);
}

Thx css!