title: How to submit slider value when user change it's value, without any buttons?
body: <p>I'm trying to get a sphere floater to answer to my web page as soon as the user releases a slider, just as in a remote controller. However, with my little to no experience in HTML, I was not able to come up with a solution like "if slider's value changes, post new value (do what the submit button does)", as I probably could on something like C++ or Python.</p>
  
  <p>Right now, my HTML code is as follows: </p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;style&gt;
  #slidecontainer {
      width: 100%;
  }
  
  .slider {
      -webkit-appearance: none;
      -webkit-transform: rotate(270deg);
      width: 250px;
      height: 10px;
    position:absolute;
      top:50%;
      left:50%;
      left:30px;
      top:300px;
      background: #d3d3d3;
      outline: none;
      opacity: 0.7;
      -webkit-transition: .2s;
      transition: opacity .2s;
  }
  
  }
  &lt;/style&gt;
  &lt;body&gt;
  &lt;h1 style="color:blue;"&gt;Floating spheres&lt;/h1&gt;
  &lt;p&gt;Use slider to change sphere's height.&lt;/p&gt;
  
  &lt;FORM action="/" method="post"&gt;
  &lt;P&gt;
  &lt;input type="range" name="POT" min="0" max="100" value="50" class="slider" id="myRange"&gt;
  &lt;p&gt;Power: &lt;span id="demo"&gt;&lt;/span&gt;%&lt;/p&gt;&lt;br&gt;
  &lt;INPUT type="submit" name="Send"&gt;
  &lt;/P&gt;
  &lt;/FORM&gt;
  
  &lt;script&gt;
  var slider = document.getElementById("myRange");
  var output = document.getElementById("demo");
  output.innerHTML = slider.value;
  
  slider.oninput = function() {
    output.innerHTML = this.value;
  }
  
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>EDIT:</strong></p>
  
  <p>I don't have much time to go deeper into HTML right now, so straight forward answers are much appreciated. </p>
  
  <p><strong>I want to change the value of "myRange".</strong></p>