如何在WordPress中使用SVG创建交互式时间轴（示例网站：https：//evianexperience.com/en）

Question

我正在用WordPress创建一个网站，并且正在使用DIVI主题。

我需要帮助来为项目创建交互式时间表。示例站点为：https://evianexperience.com/en。这正是我想要实现的东西。

请查看我的网页布局（https://snag.gy/IKF13r.jpg），以了解我的实际需求。

我曾尝试使用交互式讲故事（https://tympanus.net/codrops/2015/12/16/animated-map-path-for-interactive-storytelling/），但也没有用。

Answer 1

您可以尝试滚动魔术，似乎具有许多功能可以实现所需的功能。

http://scrollmagic.io/

我也认为skrollr仍然可以工作，但是它已经很老了

https://github.com/Prinzhorn/skrollr

Answer 2

如果您确切需要它们所拥有的东西，则看起来他们正在使用称为greensock的产品，甚至可能使用以下模块：https://greensock.com/drawSVG以及ScrollMagic通过滚动来控制动画。我在网上找到了一个使用不同动画https://ihatetomatoes.net/svg-scrolling-animation-triggered-scrollmagic/

的教程

我认为您不能仅靠Divi就能做到，您绝对可以尝试一些免费的滚动插件。否则，您可以查看greenstock的免费/商业许可证是否适用于您的项目。