防止webkit-transition的webkit-transition的闪烁 [英] Prevent flicker on webkit-transition of webkit-transform

问题描述

可能重复：

iphone webkit css animations cause flicker

原因，在我的webkit-transform属性的动画发生之前，有轻微的闪烁。这是我在做什么：

For some reason, right before my animation of the webkit-transform property occurs, there is a slight flicker. Here is what I am doing:

CSS：

#element {
    -webkit-transition: -webkit-transform 500ms;
}

JavaScript：

JavaScript:

$("#element").css("-webkit-transform", "translateX(" + value + "px)");

在转换发生之前，有一个闪烁。任何想法为什么这是，我如何解决这个问题？

Right before the transition takes place, there is a flicker. Any idea why this is, and how I could fix the problem?

谢谢！

：这只会发生在Safari中。

Update: this only occurs in Safari. It does not happen in Chrome, although the animation does work.

推荐答案

解决方案在这里提到： http://stackoverflow.com/questions/2946748/iphone-webkit-css-animations-cause-flicker

The solution is mentioned here: http://stackoverflow.com/questions/2946748/iphone-webkit-css-animations-cause-flicker.

对于您的元素，您需要设置

For your element, you need to set

-webkit-backface-visibility: hidden;

这篇关于防止webkit-transition的webkit-transition的闪烁的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！