Question

position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #fff;
overflow: hidden;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-animation-delay: 0;
animation-delay: 0;
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
-webkit-transform-style: preserve-3d;
-webkit-perspective: 1000;

为什么申请了上述css的<div>在动画时遇到延迟？这是在Cordova应用程序中，动画在iOS上非常干净和流畅，但在Android中严重滞后。我在Android上的应用程序中的其他元素是非常流畅的动画，它只是这个元素。我是硬件加速，使用转换等......但是没有运气。这是在元素上使用的动画：

@keyframes slideInRight {
  from {
    z-index: 10;
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    z-index: 10;
    transform: translate3d(0, 0, 0);
  }
}

Answer 1

您是否使用Crosswalk WebView引擎进行测试？

cordova-plugin-crosswalk-webview

Android Cordova应用程序

1 个答案: