SVG анимация, которая запускается при наведении, не воспроизводится, когда SVG загружается с помощью тега изображения

Question

У меня есть следующая анимация:

https://svgur.com/i/6XH.svg

Если вы нажмете на ссылку, вы увидите, что она начинает воспроизводиться, когда вы наводите на нее курсор.

Однако, когда я загружаю svg на страницу с помощью тега изображения, как это сделано ниже, событие hover, похоже, не достигает изображения svg.

Возможно ли это как-то сделать? Невозможно вставить svg непосредственно в html-страницу, потому что программное обеспечение, которое я использую, не позволяет этого.

Answer 1

Изображения с дизайном не представляют DOM, и их содержимое не может получать события мыши; целью события hover является сам элемент <img>. Вместо этого вы можете использовать тег <object> или <iframe>. SVG затем вставляется как вложенный документ, с которым пользователи могут взаимодействовать.

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