syndicatefx
6/14/2016 - 2:47 PM

sfx asynchronously load svg icons sprite

sfx asynchronously load svg icons sprite

nav
  a.icon(href="your/twitter/url" title="Twitter") 
    svg 
      use(xlink:href="#twitter")

  a.icon(href="your/github/url" title="Github")
    svg 
      use(xlink:href="#github")
  
  a.icon(href="your/codepen/url" title="Codepen")
    svg 
      use(xlink:href="#codepen")
doctype
html(lang="en")
  head
    meta(charset="utf-8")
    meta(http-equiv="X-UA-Compatible", content="IE=edge")
    meta(name="viewport", content="width=device-width, initial-scale=1.0")
    meta(name="handheldfriendly", content="true")
    meta(name="mobileoptimized", content="320")
    title Your Website
    link(rel="stylesheet", href="css/yourstyle.css")
  body
    
    include ./nav.jade
    
    script.
      (function(d,p){
        var a = new XMLHttpRequest(), 
        b = d.body;
        a.open("GET", p, !0);
        a.send();
        a.onload = function(){ 
          b.insertAdjacentHTML("afterbegin", a.responseText);
        }
      })(document,"icons.svg");
codepen icon github icon twitter icon