1. 遅延にanimation-deferまたはsetimeoutを使用すると、アニメーションの遅延が発生するのはなぜですか。遅延を使用しない場合は非常にスムーズです。800kの画像を移動しています。その遅延は、常にスタックするという意味ではありません。たとえば、次の場合次のアニメーション: moveup 0.9s easy-in-out forwards; アニメーションへの変更: moveup 0.9s easy-in-out forwards 0.4s;、約 0.5 秒でスタックしますか?
2.
メインのコードは上記の CSS で、後から js を使用して目的を達成するためのクラス名を追加します。
3. 携帯電話でのテストでは遅延が発生しますが、パソコン側では問題ありません。エラーメッセージも表示されません。つまり、遅延を追加しない場合はアニメーションがスムーズに進行します。遅延を追加する場合は、追加された遅延時間 (0.4 秒または 0.6 秒など) に基づいて、さまざまな位置でフリーズします。コンピューターでテストする場合は問題ありませんが、携帯電話でテストするとフリーズします。私の携帯電話アンドロイドです。4.
/a/11...、
を最適化するためにコンピューターでさまざまな答えを検索しました。最初は left を使用していましたが、後で変更し、transform を使用することを学びました
問題ないようです、赤色も出ていません。考えられる原因を知りたいです
黄舟2017-05-24 11:39:02
CSS ハードウェア アクセラレーションを有効にするために、translateZ(0) を追加しました。この部分は実際にはスタックしていますが、これはページが CSS をロードするときに発生するため、アニメーションにはプリセットがあり、ロード処理が発生することがわかります。ブラウザ レンダラーが計算のために結果をハードウェアに渡した後に結果を返すプロセス中に (2 つの不動アニメーション ソリューションを使用できます。JS はタイムアウトを使用するか、タイムアウトを使用しません。メモリの可視性を確認します。もちろん、アニメーションは複雑です \ただし、JS コントロールはプリロード プロセスを人為的に遅延させ、現在のアニメーションとは別に遅延アニメーションを計算し、大量の計算 (シャドウとアニメーション) を実行します。透明度) は、明らかなちらつき、フレームスキップ、さらには遅延を引き起こします
もちろん、別の極端な例もあります。トランスフォーム、トランジション、アニメーションの混合です。2 つのアニメーションを切り替える場合、プリロードされたアニメーション プロセスを切り替える必要があり、上記の状況も発生します。話しすぎてごめんなさい; PS: chrome、FF、IE10 はすでに w3c 標準書き込みをサポートしています;
リーリー