0
jqueryを使用してdivをページ上部にアニメーション表示していますが、何らかの原因でChromeでこれを表示したときにちらつきが激しくなります。ここに私が意味するものの過度に単純化されたバージョンがあります。このちらつきを避ける方法はありますか?jqueryを使用してdivをページ上部にアニメーション表示するが、Chromeで点滅する
jqueryを使用してdivをページ上部にアニメーション表示していますが、何らかの原因でChromeでこれを表示したときにちらつきが激しくなります。ここに私が意味するものの過度に単純化されたバージョンがあります。このちらつきを避ける方法はありますか?jqueryを使用してdivをページ上部にアニメーション表示するが、Chromeで点滅する
私はあなたが提供した例を実行し、それはあなたがあなたのload_bar要素上のハードウェアアクセラレーションを強制することができます提案としてしかし、私のために点滅しません。
#load_bar {
height:10px;
position:absolute;
background:black;
right: 0;
top: 400px;
width: 300px;
/* Force hardware acceleration */
-webkit-transform: translate3d(0, 0, 0);
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
}
あなたが他のブラウザをサポートするために、他の人を追加することができ、これが唯一の(ため-webkit-プレフィックス)WebKitのブラウザでは動作しますのでご注意ください。
こちらがお役に立てば幸いです。
ちらつきについて何をすべきか分かりませんが、アニメーションをチェーン化するだけでコードを簡単にすることができます: '$("#load_bar ")。animate({right:0}、1000).animate({top:0 }、1000); '。同じオブジェクト上の連続したアニメーションに対して完了関数を使用する必要はありません。 – jfriend00
Roeland、私はChromeでテストし、ちらつきなく完全に動作します。ただし、別のコンピュータで試すことができます。純粋に経験的なので回答を投稿していませんでしたが、私はその問題が一度しかなく、ブラウザだけであったため、別のマシンで正常に動作していました。 – lu1s