Android webkit上的CSS3动画问题-迭代计数和'；远期'；不要停止动画

我正在使用一些CSS32D变换为Android特定web应用程序的菜单设置动画

我使用Javascript插入动画参数，因为它们仅在触发ontouchstart函数后应用

以下是动画第一部分的javascript示例：

function d1(){
        var d1=document.getElementById('d1');
        d1.style["-webkit-animation"] = "slide1";
        d1.style["-webkit-animation-duration"] = "3s";
        d1.style["-webkit-animation-iteration-count"] = "1";
        d1.style["-webkit-animation-fill-mode"] = "forwards";
        }

以下是

幻灯片1

动画的CSS3：

     @-webkit-keyframes slide1 {
       0%{-webkit-transform:translateY(0) scaleY(0);}
       100%{-webkit-transform:translateY(122px) scaleY(1);}
     }

此代码正确显示动画，但一旦动画的每个状态完成，它就会消失。据我所知，这应该通过使用

-webkit动画填充模式：forwards

或

-webkit动画迭代计数：1

来解决，但这两种模式都不会在动画播放后停止/暂停动画

---

还有其他人遇到过类似的安卓问题吗？请帮忙。谢谢

您是否调查过您的动画是否返回到0%阶段，例如，将初始缩放设置为0.25或类似

此外，您还可以测试所有可能的填充模式（无/向前/向后/两者），以查看其是否有效

---

此外，建议（为了更好的性能）使用

translate3d（）

而不是translateX/Y。

您是否调查过动画是否返回到0%阶段，例如将初始比例设置为0.25或类似值

此外，您还可以测试所有可能的填充模式（无/向前/向后/两者），以查看其是否有效

---

此外，建议（为了更好的性能）使用

translate3d（）

而不是translateX/Y。

只需将其添加到CSS中即可。Android不喜欢嵌套或简写。我尝试过这个，它对我来说很好，这就是我制作所有webKit动画的方式

@-webkit-keyframes slide1 {
    -webkit-transform: translateY(122px);
    -webkit-transform: scaleY(1);
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-duration: 3s;
}

---

只需将此添加到CSS中。Android不喜欢嵌套或简写。我尝试过这个，它对我来说很好，这就是我制作所有webKit动画的方式

@-webkit-keyframes slide1 {
    -webkit-transform: translateY(122px);
    -webkit-transform: scaleY(1);
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-duration: 3s;
}

---

这个问题在Android 4上得到了解决，但只需在单独的

-webkit动画填充模式中定义
转发
，就可以在代码和样式表中实现。这个问题在Android 4上得到了解决，但是，在单独的
-webkit动画填充模式
声明中简单地定义
转发
，就可以在代码和样式表中实现这一点。