Skip to content

Instantly share code, notes, and snippets.

Created August 6, 2014 15:26
What would you like to do?
Load combined svg file into body
<!-- load combined svg file (with symbols) into body-->
(function (doc) {
var scripts = doc.getElementsByTagName('script')
var script = scripts[scripts.length - 1]
var xhr = new XMLHttpRequest()
xhr.onload = function () {
var div = doc.createElement('div')
div.innerHTML = this.responseText = 'none'
script.parentNode.insertBefore(div, script)
}'get', '/svg/icons.svg', true)
<!-- display single icon from combined file -->
<svg width="40" height="40"><use xlink:href='#icon-name'></svg>
Copy link

fatso83 commented Feb 15, 2017

This has a bug. It will prevent clip-paths from working when using statements. See this stackoverflow question. By changing display: none to width: 0; height: 0 it will work in all cases.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment