複数の gif および png 画像を含む 13 秒のアニメーションを含む Web ページがあります。このプロセスは、ボタンを押すことによってアクティブ化されます。私が抱えている問題は、アニメーション中にすべての png 画像の解像度がわずかに失われ、アニメーションが終了してから約 1 秒後に焦点が戻ることです。
問題を示す関連する部分にコードを間引きました (Web からのランダムな写真と GIF を使用)。アニメーションは 5 秒で、「Play Again」を押すと、アニメーション中に上部の「Wordpress」ロゴの解像度が失われます。また、アニメーションが終了すると下の絵が大きくなり、約1秒後にフォーカスが戻ってくるのがわかります（これは少し見にくいです）。
最初のアニメーションが終了するのを待ってから、[再生] を押して、これらのいずれかが発生することを確認する必要があります。なぜこれが起こるのか誰にも分かりますか？
追加するには：コードを削除しすぎたときに問題が停止したため、上記の例を取得するのに少し時間がかかりました。たとえば、背景のグラデーション画像を削除すると、「Wordpress」の画像は非常に迅速に解像度を回復し、アニメーションがまだ進行中です。リンクを参照してください。