使用javascript更改输入范围滑块的颜色

Question

如何从

更改滑块的颜色

<input type="range" id="input">

我已经尝试了颜色，bg颜色和背景颜色，它不会改变......

更新：

我想用javascript改变它。像这样：

document.getElementById("input").style.background-color = "000000";

Answer 1

试试这个：

input[type=range] {
    -webkit-appearance: none;
    background-color: silver;
    width: 200px;
    height:20px;
}

input[type="range"]::-webkit-slider-thumb {
     -webkit-appearance: none;
    background-color: #666;
    opacity: 0.5;
    width: 10px;
    height: 26px;
}

document.getElementById("input").style.backgroundColor = '#000000';

的 jsfiddle