Change properties with a range slider

Question

Change properties with a range slider

Navigation

#1 by (1 votes)

0

Hi, I would like to know how I can change the size of a div gradually with a range slider.

Thank you very much.

javascript html slider

asked by Anonimo 06.04.2018 в 18:39

source

1 answer

Sort a Object (JS) Call a controller from a view that belongs to another controller

score 1 · Answer 1

var range = document.getElementById("my-range");
var square = document.getElementById("square");

range.addEventListener("change", function() {
  square.style.zoom = this.value;
});

#square {
  margin: 20px;
  background: red;
  width: 50px;
  height: 50px;
}

<input id="my-range" type="range" step="0.25" min="0.25" max="4" />

<div id="square"></div>

credits