Reactjs 如何根据浏览器的滚动位置逐步浏览GIF动画？

我有一个GIF，我将在我正在构建的React web应用程序中使用。我想能够通过动画的滚动位置的基础上一步的网站。 也就是说，当我滚动页面的50%时，我希望gif在其50%的位置显示图像。 gif将位于div中，位置：fixed。因此，它将始终位于浏览器的上角

web应用程序是一个react应用程序，因此如果有可能有一个react库来实现这一点，那就太好了

---

谢谢

似乎至少有一个现成的React实现，用于处理与GIF的交互/播放，可能有助于您的项目

是一个React组件，它创建了一个类似于Facebook实现的GIF播放器。它还附带了一个暂停功能和一个示例，您可以使用它根据滚动位置在相应的点以编程方式暂停GIF

是一个纯JavaScript工具，用于提取GIF帧并保存到文件。您可以创建单个帧，并将帧与滚动的某些点对应

我不知道有哪款gif播放器能够实现您的期望，尽管其他人可能会在这方面提供帮助。如果没有，您可能需要结合使用，或者自己进行完整的实现

---

希望这能有所帮助。

您能分享一些到目前为止编写的代码吗？你试过什么吗？我真的不知道从哪里开始。所以我想知道我是否可以在这里找到一些想法。谢谢！这些看起来很有希望。我会试试看，让你知道我能做什么。