onlyhom / touch-scale-img

移动端手势缩放图片 适用于文章中图片放大缩小查看
MIT License
11 stars 6 forks source link

代码有几处不兼容现目前的移动端浏览器 #2

Open iyzyi opened 5 years ago

iyzyi commented 5 years ago

需修改touch_scale_image.js的几处代码: document.addEventListener("touchmove", self.eventStop, false);改为document.addEventListener("touchmove", self.eventStop, { passive: false });

document.removeEventListener("touchmove", self.eventStop, false);改为 document.removeEventListener("touchmove", self.eventStop, { passive: false });

y1 = e.touches[0].pageY - document.body.scrollTop;
y2 = e.touches[1].pageY - document.body.scrollTop;

改为

y1 = e.touches[0].pageY - (document.body.scrollTop + document.documentElement.scrollTop);
y2 = e.touches[1].pageY - (document.body.scrollTop + document.documentElement.scrollTop);

修改后的代码在Chrome,360极速浏览器,UC开发版下测试通过

iyzyi commented 5 years ago

第一二处改动修复了图片弹出时,没有禁止页面滚动的问题。 第三处改动修复了因获取滚条坐标失败,而使纵坐标不是相对屏幕的坐标而是相对页面开头的坐标,使得图片缩放时,图片的坐标计算错误,从而使图片跑到屏幕外。