我正在为一位朋友制作一个页面，当您单击链接时，该页面具有动画 gif。云突然出现，页面重定向。当页面重定向时，云（另一个 gif）散开。由于缓存问题，我不得不为每个 gif 实例添加一个随机 ID，从而减慢我的网站速度。
我现在在计时器上重定向了我的页面，但是由于互联网状况不佳，进入云的 gif 图像通常会很短，因此当页面重定向并被云覆盖时，它看起来真的很尴尬。如果需要，我可以链接该页面。
如何在重定向或采取其他操作之前检查我的动画是否已完成？
【问题讨论】：
我不相信可以使用 Javascript 来确定 gif 何时完成。您可以使用的一种方法是制作一个较长的静态图像，并让它在仅显示其中一部分的 div 中向右滑动。
例如。想象一个 10x10 的 div，里面有一个 100x10 的图像。通过使用 javascript 移动图像，您可以在 div 中一次显示一帧图像
【讨论】：
所以我来晚了，但我现在遇到了类似的问题。
如果您知道 .gif 文件的长度，一个解决方案可以是创建一个 setTimeout。
例如，我在 Adobe Photoshop 中创建了一个 7 秒长的 .gif 文件，并将其添加到我的 React 应用程序的公共文件夹中。 当我创建包含我的 gif 的组件时，我还使用 setTimeout() 在 7 秒后运行一个函数。
这大概是这样的::
const [showGIFValue, showGIFUpdate] = useState("file.gif");
return (<div>
<img id="uniqueID" src={showGIFValue} alt="alt text"/>
{setTimeout(()=>{
//change showGIFValue from the .gif file to a .png file
showGIFUpdate("file.png");
}, (7000))}
</div>);
因此，对于您的问题，您需要查看云何时完成俯冲，因此请查看您的文件并查看 gif 持续了多少毫秒，然后创建一个 setTimeout() 将在该时间之后运行您的函数。
【讨论】：