Javascript PinchZoom.js与iOS设备上的Owl转盘不兼容

因此，我一直在（再次）思考我遇到的这个问题。我已经指出我的问题是插件不兼容

我还使用了最新版本的Owl Carousel v2.3.4，显然PinchZoom.js完全停止工作，因此我不得不使用早期版本的Owl Carousel来实现我需要的功能

问题是，在带有Owl旋转木马滑块的页面上，PinchZoom.js可以在Android和桌面设备上正常工作，但只要我使用iOS设备（iPad或iPhone），在放大该页面时，图像就会模糊。其他页面可以很好地使用PinchZoom，但没有定义Owl转盘插件

3.0万T，0.8万T，0.8万T，0.3万T，0.8万T，0.8万T，0.0 0，0.3万T，0.0 0，0 0 0，0 0 0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，0，r，r，r，r，k，k，k，k n克克克克克尼，i，i，i，我，我，我，我，我828282777777777777，我，我，我?克克克克奈奈奈奈奈奈奈奈奈奈奈奈奈奈奈奈奈奈奈奈奈本本，我，我，我，我，我，我，我，我，我828282828282828282"o,o,T,h,e,f,o,l,o,w,i,n,g:"

在iPhone或iPad上，单击底部的广告容器将其隐藏，然后选择日期为2019年11月1日。。现在，当您双击以缩放第一页时，您将看到它在缩放时模糊。现在，当您转到下一页并进行缩放时，您将注意到图像未模糊且显示不正确

iOS设备上的双击缩放和收缩缩放在使用Owl转盘初始化的页面上也不起作用

有人知道为什么PinchZoom.js在iOS设备上与Owl转盘不兼容吗

任何帮助都将不胜感激

更新：这仍然是一个问题。我甚至尝试使用另一个名为的滑块，但问题仍然存在。我甚至尝试过更改滑块和整个页面的

css

样式，但没有成功

在PinchZoom中，有一个名为

use2d

的选项，可以正确处理未使用Owl转盘初始化的页面，但一旦使用Owl转盘或Slick初始化页面，此属性就会失败。我相信这与插件的

translate

和

scale

属性有关。可能是一些相互冲突的变化导致了这一点，但为什么只在iOS设备上

---

有什么帮助吗？

请确保您在用于桌面和android的浏览器上签入ios设备，这看起来像是css兼容性（浏览器支持）问题

如果它在chrome中运行良好，那么在所有需要的设备中安装chrome并尝试一下

注意：-PinchZoom写在Vanilla JS上，而owl carousel写在jquery上，所以JS冲突的可能性非常小，因为它也在桌面上工作

检查浏览器支持

---

你的链接无法访问-

因此，经过大量的研究和尝试，我无法在同一页面上同时使用这两个插件，因为

translate3d

属性被插件覆盖

我发现的解决方法是在

jQuery

中使用

滑块

插件，该插件不使用

translate3d

选项来滑动图像。幸运的是，我找到了这样一个插件，它使用了

translateX

属性，并将其整合到我的页面中，现在在

PinchZoom

功能方面一切正常。问题中当前的

url

现在已更新为使用新的滑块插件，如果您看到在

iOS

设备上缩放时，模糊图像将不再像以前那样可见

我不认为这是正确的答案，因为这只是一个解决办法，而不是我所问的最初问题的实际解决方案。如果还有人知道问题发生的原因，我想知道

---

谢谢你调查此事。我100%确定我只检查iOS设备。使用控制台调试器时，您不会看到此问题。这只发生在实际的苹果设备上。链接无法访问？你能给我看看你在链接上看到了什么吗。您可能必须更改浏览器设置以允许使用所有脚本。iOS设备的哪个浏览器是Chrome还是Safari？它在iOS设备上的两个浏览器上都不起作用。请粘贴您的翻译和缩放css

// Below code will only work on chrome.  
  yourdiv {
   transform: translate(50px, 100px);
   transform: scale(2, 3);
  }