1

I'm using a set of svg icons that get injected into the page from a separate file.

<svg class="icon-home"> <use xlink:href="symbol-defs.svg#icon-home"></use> </svg>

This loads the path into the shadow DOM. Is there any way that I can get the path length in order to do a 'drawing' animation, or am I going to have to rethink how I'm loading the svg into the DOM? I'm doing it this way because it is part of a page builder plugin and the user can select from a large number of icons.

Robert Means
  • 41
  • 4
  • Would it not be possible to retrieve this information from the symbol itself? What type of animation are you trying to accomplish and what is the content of the symbol? – Jon Koops Jul 30 '17 at 13:47
  • 1
    While referencing external files in `` nowadays works chross-browser, Firefox *still* does not support `SVGUseElement.instanceRoot`. Therefore, it seems the solution presented in [Accessing a DOM object defined in an external SVG file](https://stackoverflow.com/questions/3346106/accessing-a-dom-object-defined-in-an-external-svg-file/3378320#3378320) stills stands: load the icon via XHR. – ccprog Jul 30 '17 at 14:29

0 Answers0