<input id="seekslider" type="range" min="0" max="100" value="0" step="1" onchange="updateStyle(value)">

seekslider = document.getElementById("seekslider");

function updateStyle(v){
    c = 100 - v;
    seekslider.style.background = "-moz-linear-gradient(left,  #ed1e24 0%, #ed1e24 "+ v +"%, #191919 "+ c +"%, #191919 100%)";
    seekslider.style.background = "-webkit-gradient(linear, left top, right top, color-stop(0%,#ed1e24), color-stop("+ v +"%,#ed1e24), color-stop("+ c +"%,#191919), color-stop(100%,#191919))";
    seekslider.style.background = "-webkit-linear-gradient(left,  #ed1e24 0%,#ed1e24 "+ v +"%,#191919 "+ c +"%,#191919 100%)";
    seekslider.style.background = "-o-linear-gradient(left,  #ed1e24 0%,#ed1e24 "+ v +"%,#191919 "+ c +"%,#191919 100%)";
    seekslider.style.background = "-ms-linear-gradient(left,  #ed1e24 0%,#ed1e24 "+ v +"%,#191919 "+ c +"%,#191919 100%)";
    seekslider.style.background = "linear-gradient(to right,  #ed1e24 0%,#ed1e24 "+ v +"%,#191919 "+ c +"%,#191919 100%)";
    alert(v +" + "+c+" = "+(Number(v)+Number(c)));
}