Как изменить цвет SVG при наведении?

Question

[maxon76]

Есть SVG вставленный в HTML через object:

<object type="image/svg+xml" class="sf" data="/wp-content/uploads/2023/vk.svg" width="48" height="48"></object>

Нужно изменить цвет SVG при наведении. Пробовал так, не получается:

.sf:hover path {
fill: #fff;
}

Подскажите как это можно сделать?

Comments

[RAX7]

Проще вставить svg через тег <svg>. Либо попробовать прикрутить такой костыль на onload

<object type="image/svg+xml" class="sf" data="/wp-content/uploads/2023/vk.svg" onload="this.getSVGDocument().documentElement.classList = this.classList; this.replaceWith(this.getSVGDocument().documentElement)" width="48" height="48"></object>

Answer 1

[Noder SS]

Не знаю, кто создатель, но свг всегда перекрашиваю данным кодом, с помощью фильтров

Answer 2

[Максим]

Тег img можно распарсить на jquery таким образом
Object надо подумать