过渡后 Safari 中的渲染问题答案

【问题标题】：rendering issues in safari after transition过渡后 Safari 中的渲染问题
【发布时间】：2015-05-14 09:36:31
【问题描述】：

我有一个幻灯片，可以在每个图像可见时将其放大。在所有看起来不错的浏览器中，除了在 Safari 中，当触发任何其他 css 转换操作时，图像的平滑看起来很糟糕。

这是一张图片：http://snag.gy/43LaH.jpg

右边的图像是过渡发生后的（看一下草和泥）。

有什么建议吗？

【问题讨论】：

你看过stackoverflow.com/questions/3900436/…。看来image-rendering:-webkit-optimize-contrast;应该可以解决了
没见过那个。这个解决方案只改变了一件事：现在它看起来一直很糟糕，而不仅仅是在转换之后......

标签： css image rendering

【解决方案1】：

为似乎欺骗渲染引擎的问题找到了解决方案......但它绝对是一个黑客

#showcase img {
    -webkit-animation: spinhack 1s linear infinite;
    -moz-animation: spinhack 1s linear infinite;
    animation: spinhack 1s linear infinite;
}

@-moz-keyframes spinhack { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(0deg); } }
@-webkit-keyframes spinhack { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(0deg); } }
@keyframes spinhack { from { transform: rotate(0deg); } to { transform: rotate(0deg); } }

【讨论】：