使用图像标签加载 svg 时，从悬停开始的 Svg 动画不会播放-6ren

使用图像标签加载 svg 时，从悬停开始的 Svg 动画不会播放

转载作者：行者123 更新时间：2023-12-02 20:25:15

24

4

我有以下动画:

如果您点击该链接，您将看到将鼠标悬停在该链接上后它就会开始播放。

但是，当我使用图像标签在页面上加载 svg 时(如下所示)，悬停事件似乎没有到达 svg 图像。

有可能以某种方式做到这一点吗？不能直接将 svg 粘贴到 html 页面中，因为我使用的软件不允许这样做。

最佳答案

图像的设计不公开 DOM，并且其内容无法接收鼠标事件；悬停事件的目标是<img>元素本身。您可以使用<object>或<iframe>标签代替。然后，SVG 将作为用户可以与之交互的子文档插入。

<object data="https://svgur.com/i/6XH.svg" width="322px" height="65px"></object>

关于使用图像标签加载 svg 时，从悬停开始的 Svg 动画不会播放，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50150725/

24

4

0

文章推荐： docker - Docker构建dockerfile