Safari 变换：scale()，由 JS 添加时图像质量不佳

Question

我有一个 JavaScript 函数，它向图像添加“变换：翻译（x，y）比例（z）”。但是通过这种方式，safari 并没有显示出清晰的图像，而是似乎降低了。

在 Firefox 和 Chrome 中运行良好。但是当我在开发工具中手动添加“transform: translate(x, y) scale(z)”时，图像会按我的预期显示。锋利又漂亮。

这可能是什么原因？

Image with low sharpness

Image with height sharpness

希望你能帮帮我。

Answer 1

我通过将变换属性直接添加到图像来解决了这个问题。之前，它被添加到图像的包装元素中。

现在还可以，但是当我想象一种情况时，我不得不在其中包含图像的 div 上使用变换比例时，这是 safari 的愚蠢行为。