phonegapでCSSトランジションやアニメーションが動作しない

Question

<div>をアニメーション化する必要があります。 @keyframesとトランジションを使って試しました。私はコルドバ/ PhoneGapの2.0.0を使用し、アンドロイド4.0以上を対象にしています

TRANSITION

#menu{ 
... 
width:70%; 
-webkit-transition: width 5s; 
.. 
} 

キーフレーム

#menu{ 
    ... 
    width:70%; 
    animation: menuEffect 3s; 
    .. 
    } 
@keyframes menuEffect 
{ 
from {width:0%;} 
to {width:70%;} 
} 

： は、ここでは、コードです。 私はこの作業が表示されません。移行とアニメーションはphonegapをサポートしていませんか？手伝ってください。

Answer 1

Phonegapを使用すると、プレフィックス付きのプロパティをWebkitだけで使用する必要があります。

-webkit-animation: menuEffect 3s linear

@-webkit-keyframes menuEffect 
{ 
    from { 
     width:0%; 
    } 
    to { 
     width:70%; 
    } 
} 

Answer 2

ただ、CSSプロパティに-webkit-を付加することを忘れないでください。それは私のすべての問題を解決しました。

このコードは、私の場合で働いていた：

/* Animation element id */ 
#animate { 
    position: absolute; 
    top: 100px; 
    left: 100px; 
    -webkit-animation: move 1s ease infinite; 
} 

@-webkit-keyframes move { 
    50% { 
     -webkit-transform: translate(100px, 100px); 
    } 
} 

また「に、から」使用することができますし、それがうまく動作します。