Skip to content

Instantly share code, notes, and snippets.

@stephenquan
Last active November 22, 2022 05:30
Show Gist options
  • Save stephenquan/9d20a79c99476e9d4ee240e4fd5bd300 to your computer and use it in GitHub Desktop.
Save stephenquan/9d20a79c99476e9d4ee240e4fd5bd300 to your computer and use it in GitHub Desktop.
sam.hta
<html>
<head>
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<script>
function svgToDataURL(svg) {
return "data:image/svg+xml;charset=utf-8," + encodeURIComponent(svg);
//return "data:image/svg+xml;base64," + btoa(svg); // this works too!
//return "data:image/svg+xml;charset=utf-8," + svg; // this only works in modern browsers
}
var assets = {
redCross: svgToDataURL('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path stroke="red" d="M23.985 8.722L16.707 16l7.278 7.278-.707.707L16 16.707l-7.278 7.278-.707-.707L15.293 16 8.015 8.722l.707-.707L16 15.293l7.278-7.278z"/></svg>'),
greenTick: svgToDataURL('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path stroke="green" d="M13.5 22.142L7.59 16.42l.636-.636L13.5 20.87 26.721 7.8l.637.637z"/></svg>')
};
</script>
</style>
</head>
<body>
1 + 1 = 2 <img id="demoSVG" width="16" height="16"> <p>
<script>
var demoSVG = document.getElementById("demoSVG");
demoSVG.src = assets.redCross;
</script>
<button type="button" onclick="demoSVG.src = assets.greenTick">Change SVG!</button>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment