在捏手势缩放图像

Question

我正在使用 jQuery touchy 插件来检测捏合事件，从而使用户能够放大/缩小图像。这是我的代码的要点：

变量 w = 800, h = 600; $('img').on('touchy-pinch', function (e, $target, data) { $(这个).css({ 宽度：w * data.scale， 高度：h * data.scale }); });

自定义数据对象包含以下内容：

• 规模
• previousScale
• 当前点
• 起点
• 开始距离

它在第一次捏合时效果很好，但是一旦我的手指离开屏幕然后我再次尝试这样做，图像就会重新缩放。如何修改我的处理程序以使图像从中断处继续而不是重新缩放？使用数据的 previousScale 并没有帮助，因为 previousScale 也会被重置。

Answer 1

这里的问题是您没有将变量 w 和 h 重置为其后缩放值，只有 css，因此样式在另一个缩放事件中恢复为 800x600。您需要在 scale 事件中设置为 w*data.scale 和 h*data.scale 的持久 w 和 h。