问题
I have the following animation:
https://svgur.com/i/6XH.svg
If you click on the link, you will see that it starts playing once you hover it.
However, when I load the svg on a page using the image tag, as done below, the hover event doesn't seem to reach the svg image.
Is it possible to do this somehow? It is not an option to paste the svg directly in the html page, because the software I use don't allow for that.
回答1:
Images by design do not expose a DOM and their content cannot receive mouse events; the target of the hover event is the <img> element itself. You can use an <object> or an <iframe> tag instead. The SVG is then inserted as a subdocument that users can interact with.
<object data="https://svgur.com/i/6XH.svg" width="322px" height="65px"></object>来源：https://stackoverflow.com/questions/50150725/svg-animation-that-starts-on-hover-doesnt-play-when-the-svg-is-loaded-using-ima