找了段滚轮缩放图片的JS代码

最新推荐文章于 2022-10-21 15:13:34 发布

原创最新推荐文章于 2022-10-21 15:13:34 发布 · 984 阅读

0 ·

CC 4.0 BY-SA版权

入门类同时被 2 个专栏收录

111 篇文章

订阅专栏

Web开发

108 篇文章

订阅专栏

本文介绍了一个简单的JavaScript脚本，该脚本允许用户通过鼠标滚轮缩放页面上的图片，并通过鼠标拖动来调整图片位置。此功能增强了用户体验，尤其是在查看详细图像时。

<script> 
function imgzoom(o){ 
var zoom=parseInt(o.style.zoom, 10)||100;zoom+=event.wheelDelta/12;if (zoom>0) 
o.style.zoom=zoom+'%'; 
return false; 
} 
var dragapproved=false 
function drag_dropie(){ 
if (dragapproved==true){ 
document.all.showimage.style.pixelLeft=tempx+event.clientX-iex 
document.all.showimage.style.pixelTop=tempy+event.clientY-iey 
return false 
} 
} 
function initializedragie(){ 
if (event.srcElement.parentElement.id=="showimage"){ 
iex=event.clientX 
iey=event.clientY 
tempx=showimage.style.pixelLeft 
tempy=showimage.style.pixelTop 
dragapproved=true 
document.onmousemove=drag_dropie 
} 
} 
if (document.all){ 
document.onmousedown=initializedragie 
document.onmouseup=new Function("dragapproved=false") 
} 
</script> 