0

特にiPadのSafari/WebKitでCSS3を介して背景色の変更をアニメーション化する際に問題が発生しました。

問題を示すために2つのスクリーンショットを添付しました。

  1. 画像1
  2. 画像2

色を選択すると、内側の円が現在の色から選択した新しい色にフェードインするはずです。

しかし、ご覧のとおり、アニメーション中には非常に奇妙な正方形があります。

重要なのは、アプリ全体の背景色（background DIV）も選択した色で色付けされることです。しかし、ここでは完全に不透明ではありません。非常に軽い経由：

$('#bgWrapper').css('background','rgba(XX,XX,XX,0.1)');

この要素は、完全に不透明に切り替えたときにも、色を完全にフェードさせます。

円要素（div#centerRing）は常に点滅します。と同じCSSスタイルを付けdiv#bgWrapperたり、RGBAでも色を変えたりしても。

私が試したことは何もありません。

div#bgWrapper背景を完全にフェードさせます。

div#centerRingそうではありません。

すでにこれと戦った人はいますか？よろしくお願いします、

4

1 に答える 1

1

わかりました！

iPad では、大きな要素のアニメーション (特に背景色) に問題がありました。私の要素は 1600px x 1600px でした。サイズを 800px x 800px に変更し、CSS3 を介して少し拡大 (scale(2)) すると機能します。また、要素が CSS3 を介して再度アップスケールされた場合。

それが役立つことを願っています。

于 2013-02-02T13:32:29.360 に答える