搜尋 Mozilla 技術支援網站

防止技術支援詐騙。我們絕對不會要求您撥打電話或發送簡訊,或是提供個人資訊。請用「回報濫用」功能回報可疑的行為。

了解更多

GIF animation is reset when a new image is added to the page.

  • 1 回覆
  • 1 有這個問題
  • 7 次檢視
  • 最近回覆由 cor-el

more options

Hello! Short story: I recently discovered that adding a new GIF image to a page resets the animations of existing GIF images on the page with the same src.

Expected behavior: Adding a new GIF image to the page should not reset the animation of existing images with same src.

Actual result: Adding a new GIF image to the page resets the animation of all existing GIF images on the page with same src.

Code with example: https://codesandbox.io/s/heuristic-platform-jsguir Video demo: https://www.youtube.com/watch?v=k-ZMrrqq_KI

Simplified version of the code showing unexpected behavior: https://codesandbox.io/s/elastic-shtern-vwrcx1

Does anyone know why this is happening? Is this a bug?

Browser: Firefox Developer Edition 102.0b4 (64-bit) OS: Windows 11

Hello! '''Short story''': I recently discovered that adding a new GIF image to a page resets the animations of existing GIF images on the page with the same src. '''Expected behavior''': Adding a new GIF image to the page should not reset the animation of existing images with same src. '''Actual result''': Adding a new GIF image to the page resets the animation of all existing GIF images on the page with same src. Code with example: https://codesandbox.io/s/heuristic-platform-jsguir Video demo: https://www.youtube.com/watch?v=k-ZMrrqq_KI Simplified version of the code showing unexpected behavior: https://codesandbox.io/s/elastic-shtern-vwrcx1 Does anyone know why this is happening? Is this a bug? '''Browser''': Firefox Developer Edition 102.0b4 (64-bit) '''OS''': Windows 11

所有回覆 (1)

more options

I think that all GIF image animations use the same code and that they are somehow synchronous (i.e. use the same frame timings). It is possible that loading a new GIF image resets this code and causes it to restart all GIF animations. In that case there is not much you can do about this.