Using Input Type="range" To Scale An Image

What the title says. Is it possible? I want an image to scale up and down from it's center using a slider such as the input type='range'. Thanks in advance!

Solution 1:

<input id="ranger" type="range" min="1" max="100" value="100" />
<hr /><imgid="image"src="http://google.com/images/logo.png"width="275"height="95" />var ranger = document.getElementById('ranger'),
    image =  document.getElementById('image'),
    width = image.width,
    height = image.height;

ranger.onchange = function(){
    image.width = width * (ranger.value / 100);
    image.height = height * (ranger.value / 100);
}

Demo: http://jsfiddle.net/DnE83/1/

Study it, work out how it works.