android - Phonegap Android 无法呈现 CSS 的蒙版图像，但适用于 iOS

Question

我添加了一个动画来做图像 mask ，但它不适用于 android。 android 是否缺少任何 css？

        @-webkit-keyframes bannerPic {

        0%{ -webkit-mask-image:-webkit-linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0)5%);}
        50%{ -webkit-mask-image:-webkit-linear-gradient(0deg, rgba(0,0,0,1) 50%, rgba(0,0,0,0)55%);}
        100%{ -webkit-mask-image:-webkit-linear-gradient(0deg, rgba(0,0,0,1) 100%, rgba(0,0,0,0)100%);}
        }



       .bannerMoveRight
       {
        -webkit-animation: bannerPic 5s linear;
        -moz-animation:bannerPic 5s linear;
        animation:bannerPic 5s linear;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
       }
      .bannerMovePause
      {
        -webkit-animation-play-state: paused;
      }
      .bannerMoveRun
      {
        -webkit-animation-play-state: running;
      }

Answer 1

最后，发现 android Google API 22 与 -webkit-mask 一起工作，但在 android Google API 23 上不工作。

我的看法:

在使用Phonegap和android和iOS的原生语言开发之后，我强烈建议使用android或iOS的原生语言来开发你的应用程序。 Phonegap 使用 WebView 生成应用程序，这导致开发人员无法在不同设备上轻松控制布局的巨大问题。