Question

103

Change color of input range slider with javascript

rated 0 times [ 110] [ 7] / answers: 1 / hits: 17433 / 11 Years ago, wed, august 28, 2013, 12:00:00

How can I change the color of my slider from

<input type=range id=input>

I already tried color, bg-color and background-color and it won't change...

UPDATE:

I wanna change it with javascript. Something like this:

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

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

leslijessalyng

Add To Favorites

Follow

Total Points: 650

Total Questions: 85

Total Answers: 109

Location: Croatia

Member since Mon, Sep 6, 2021

3 Years ago

leslijessalyng questions

1 Vue dist path for CSS and JS not found

Fri, Feb 21, 20, 00:00, 4 Years ago

1 How do I loop through multiple pages in an API?

Tue, Jul 30, 19, 00:00, 5 Years ago

1 ReactJS and autofocus

Fri, Jul 5, 19, 00:00, 5 Years ago

1 How to fix The message port closed before a response was received. after window.location.reload() in javascript

Wed, Apr 3, 19, 00:00, 5 Years ago

1 TypeError: $ .find is not a function

Wed, Mar 13, 19, 00:00, 5 Years ago

View All

answered 11 Years ago kayap · Accepted Answer

Try this:

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