html5 图片手势缩放，如何计算transform-origin
图片手势缩放
我的思路是，计算手指移动后，两个触摸点的中点相对于图片左上角的坐标，得出transform-origin（即变换中心）
根据手指移动前后的距离，得出缩放比例
然而，按照这个思路，得出效果却有bug，图片在放大/缩小到一定程度，会有严重的抖动、漂移现象
问题排查
如果，不设置transform-origin，图片缩放就没有上面所说的现象。因此，我觉得一定是我计算transform-origin的姿势有问题...
问题已解决
不使用动态修改transform-origin的方法
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
touchstart的时候计算两个手指的中点？
仿射变换。
每次变化的时候更新 HTMLElement.style.transform.matrix 的传递参数即可。使用 transform 的优点是变换不会引起浏览器回流，有性能优势，缺点就是如果有事件监听的话，需要逆变换才能拿到真实坐标。