Skip to content

Instantly share code, notes, and snippets.

@Adrian1907
Last active March 10, 2018 19:45
Show Gist options
  • Select an option

  • Save Adrian1907/ad3d6e149056317836ab98b5378f05c4 to your computer and use it in GitHub Desktop.

Select an option

Save Adrian1907/ad3d6e149056317836ab98b5378f05c4 to your computer and use it in GitHub Desktop.
SCSS + SVG sprite
//Scss
$sprite-map: (
vk: '0 -1 101 101',
fb: '0 105 101 101',
gp: '0 210 101 101'
);
@each $fragment, $viewbox in $sprite-map {
.#{$fragment} {
background-image: url("../img/icons_sprite.svg#svgView(viewBox(#{$viewbox}))");
}
}
//JavaScript
document.addEventListener("DOMContentLoaded", checkSVGFeature);
function checkSVGFeature() {
var cssFallback = document.createElement('link');
cssFallback.rel="stylesheet";
cssFallback.type="text/css";
cssFallback.href="css/svg-fragment_fallback.css";
if (!document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#Image', '1.1')) {
document.querySelector('head').appendChild(cssFallback);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment