Java Script button which changes color

Task: create a button that changes its color depending on the numbers in the inputs

Java Script code:

function color() {
  //First input
  let colorValueFirst = document.getElementById('inputRed').value;
  //Second input
  let colorValueSecond = document.getElementById('inputGreen').value;
  //Third input
  let colorValueThird = document.getElementById('inputBlue').value;
  // colorValue.classList.add("color");

  let fullColor = "rgb(" + colorValueFirst + "," + colorValueSecond + "," + colorValueThird + ")";
  document.getElementById("chaning-div").style.backgroundColor = fullColor;

HTML code

<!DOCTYPE html>
<html lang="en">

  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="./style.css">

<body class="body">
  <div class="main">
    <div class="inputs-div">
      <input type="number" class="input" placeholder="Red" id="inputRed">
      <input type="number" class="input" placeholder="Green" id="inputGreen">
      <input type="number" class="input" placeholder="Blue" id="inputBlue">
    <div class="chaning-div" id="chaning-div" onclick="color()">
<script src="./script.js"></script>



Leave a Reply

Your email address will not be published. Required fields are marked *

Enter Captcha Here :