HTML代码
<div id="imgDiv">
<img id="img"/>
</div>
js代码
//给图片绑定鼠标滚轮事件
$("#img").addEventListener("mousewheel", function(){
var zoom = parseInt($("#img").style.zoom, 10) || 100;
zoom += event.wheelDelta / 12;
if (zoom >= 10 && zoom <= 1000) {//我这里做了最大最小倍数判断,按自己的需要进行调整
console.log(zoom);
$("#img").style.zoom = zoom + '%';//设置图片倍数(默认是100%)
}
return false;
})
以上代码只实现图片中心点的缩放,暂不支持按鼠标点位置进行缩放。(其实我也不太知道怎么按鼠标位置进行缩放,如果知道的话可以把代码贴出来,一起学习!!!)