CSS 3转换/转换/translate3d如何过渡的第一个或最后一个“帧”?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (65)

正在专门为iPad开发一个web应用程序,使用CSS 3转换来动画一个div(从左向右移动)。

.mover {
    -webkit-transition:all 0.4s ease-in-out;
}

当用户单击一个按钮时:

var s = "translate3d(" + newPosition + "px, 0, 0)";
$('.mover ').css('-webkit-transform', s);

有一个非常明显的闪烁。如何将它去掉呢?

提问于
用户回答回答于

可以尝试下这个:

.mover {
    -webkit-transition:all 0.4s ease-in-out;
}

var s = "translate3d(" + newPosition + "px, 0, 0)";
$('.mover ').css('-webkit-transform', s);

如果在调用动画之前没有设置3D坐标,你会看到闪烁。第一个调用设置这些坐标,因此后续调用将平稳地进行。

所以-试着先设置div的3D坐标。

用户回答回答于

所属标签

可能回答问题的人

  • 嗨喽你好

    7 粉丝480 提问8 回答
  • uncle_light

    5 粉丝518 提问6 回答
  • 人生的旅途

    10 粉丝484 提问6 回答
  • 富有想象力的人

    3 粉丝0 提问6 回答

扫码关注云+社区

领取腾讯云代金券