CODEWITHSUNDEEP
javascripthtmlcss
Jonathon
Jonathon

Reputation: 71

Change the background color of body when value of input with type of range is change

I have an input of a range type. When the value of input range change I want to change the background color of the body.

Here is the HTML

<div class="range">
    <input type="range" min="1" max="100" value="0" class="slider" id="myRange">
</div>

Here is the Javascript Code

let slider = document.getElementById("myRange");
slider.onchange = () => {
    document.body.style.background = `linear-gradient(90deg,  #2b2e43 0%,#2b2e43 50%,#ffffff 50.1%,#ffffff 100%);`
}

Upvotes: 0

Views: 494

Answers (1)

MomasVII
MomasVII

Reputation: 5071

I modified it a little but basically the main issue is you have added a semi colon to the value in the JS code which is not required.

  function updateSlider() {
      document.body.style.background = `linear-gradient(90deg,  #2b2e43 0%,#2b2e43 50%,#ffffff 50.1%,#ffffff 100%)`;
 
  }
<div class="range">
    <input type="range" min="1" max="100" value="0" class="slider" id="myRange" onchange="updateSlider()">
</div>

Upvotes: 1

Related Questions