5

アニメーション化する必要があり<div>ます。@keyframes と transition を使ってみました。コードは次のとおりです。

遷移

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

キーフレーム

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

私は cordova/phonegap 2.0.0 を使用しており、Android 4.0 以降をターゲットにしています。私はこれが機能しているとは思わない。トランジションとアニメーションは phonegap をサポートしていませんか? 手伝ってください。

4

2 に答える 2

12

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

このコードは私の場合に機能しました：

/* 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);
    }
}

「from、to」を使用することもできますが、うまく機能します。

于 2014-09-29T16:19:53.487 に答える
6

Phonegap では、Webkit であるため、プロパティのプレフィックス付きバージョンを使用する必要があります。

-webkit-animation: menuEffect 3s linear 

@-webkit-keyframes menuEffect
{
    from {
        width:0%;
    }
    to {
        width:70%;
    }
}
于 2013-07-02T16:43:13.943 に答える