Javascript 使用输入类型="；“范围”；缩放图像

标题上写着什么。可能吗？我希望使用诸如input type=“range”之类的滑块从图像中心上下缩放图像

提前谢谢

<input id="ranger" type="range" min="1" max="100" value="100" />
<hr />
<img id="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);
}


var ranger=document.getElementById（'ranger'），
image=document.getElementById（'image'），
宽度=图像宽度，
高度=图像高度；
ranger.onchange=函数（）{
image.width=宽度*（ranger.value/100）；
image.height=高度*（ranger.value/100）；
}

演示：

---

研究它，找出它是如何工作的。

请分享您已经尝试过的代码……非常感谢，这正是我所需要的！我无法计算出/100的价值，但我现在明白了。非常感谢。还有一件事，你知道如何使图像向中心缩放而不是向左上角缩放吗？你需要用div将图像包裹起来，然后在中心对齐-如果你需要任何进一步的帮助，你应该打开另一个问题。