在safari中使用低图像质量，使用jssor滑块

Question

我在我的网站上使用了jssor滑块，除了safari之外在所有浏览器中都能正常工作，在safari图像中很少有模糊。 我的图像尺寸大于滑块Div，图像尺寸为（1207 x 708），但div为900 x 600像素。 请帮助我如何解决这个问题

Answer 1

将此添加到滑块选项列表中：

$HWA: false

根据JSSOR参考 - link

，HWA是HardWare Acceleration

我通过另一个S.O.发现了这个选项。来自JSSOR的帖子回应了想要阻止“-webkit-transform：perspective（2000）;”的人正在注入他们的代码中。因此，它可能会影响3D过渡（未经测试）。

设置$HWA: false似乎也会禁用图像重新采样，从而使您的Retina兼容图像能够正确显示。

Answer 2

请将滑块容器尺寸设置为接近图像尺寸。如果您将容器大小设置为1200到800，它应该看起来更好。

由于滑块负责，有时会缩放到更大的尺寸。

出于某种原因，在以下情况下，safari有点问题。

假设您的图像大小（1800 x 1200），滑块大小为（900 x 600），并且滑块有响应，它将调整为（1800 x 1200）以适合您的屏幕。

可以说，您的图像从（1800 x 1200）调整为（900 x 600），然后再调整为（1800 x 1200）。 您将在safari上看到图像模糊。

原因是当较大的图像适合较小的容器时质量会丢失。当你将它扩展到更大的尺寸时，质量应该看起来更糟糕。