Skip to content

Instantly share code, notes, and snippets.

@leeoniya

leeoniya/svg2-href.html

Last active July 6, 2017 21:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save leeoniya/1bcab5a7299e9669a599c76af1a3f8f0 to your computer and use it in GitHub Desktop.
Save leeoniya/1bcab5a7299e9669a599c76af1a3f8f0 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
svg2-href.html
<!doctype html>
<html>
<head>
<script src="https://rawgit.com/leeoniya/domvm/3.x-dev/dist/pico/domvm.pico.min.js"></script>
</head>
<body>
<style>
h1 {
font-size: 4em;
}
#sheet {
display: none;
}
svg {
width: 3rem;
height: 3rem;
fill: #000;
}
</style>
<svg id="sheet" xmlns="http://www.w3.org/2000/svg">
<svg id="icon" viewBox="0 0 24 24">
<path d="M0 0h24v24H0z" fill="none"/>
<path d="M12 2c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm9 7h-6v13h-2v-6h-2v6H9V9H3V7h18v2z"/>
</svg>
</svg>
<script>
var sv = domvm.defineSvgElement;
function View() {
return function() {
return sv('svg', {class: "small"}, [
sv('use', {href: "#icon"})
]);
};
}
domvm.createView(View).mount(document.body);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment