resie image js code example

Example: javascript resize image

const img = document.querySelector('img');
//Width and height values must be integers
//Width and height are measured in pixels (px)
img.width = 128;
img.height = 128;
//To use other type of measeures (% em) style should be edited
//In this case it has to be a string
img.style.width = '10em';
img.style.height = '10em';

//Resize by input (min = 0; max = 100)
//Event mousemove is for a fluent effect
const range = document.querySelector('input[type=range]');
range.addEventListener('mousemove', evt => {
	img.style.width = evt.target.value + '%';
});