[Solved] How to make a slider with that functionality (html, css, js) [closed]

by


a simple function to do some actions base on input value can be like this : 

    document.getElementById("myRange").addEventListener("change", function (e) {
      let value = parseInt(this.value);
      let resultElm = document.getElementById("result");
      switch (true) {
        case 0 < value && value <= 20:
          resultElm.innerHTML = ":|";
          break;
        case 20 < value && value <= 40:
          resultElm.innerHTML = ":)";
          break;
        case 40 < value && value <= 60:
          resultElm.innerHTML = ":))";
          break;
        case 60 < value && value <= 80:
          resultElm.innerHTML = ":D";
          break;
        case 80 < value && value <= 100:
          resultElm.innerHTML = "^^";
          break;
      }
    });
    <input type="range" min="0" max="100" value="0" id="myRange" />
    <div id="result"></div>

you can do whatever you want inside the case blocks , highlight something , change an icon or etc …

solved How to make a slider with that functionality (html, css, js) [closed]