Skip to content

Instantly share code, notes, and snippets.

@jonashaag
Last active November 3, 2017 09:12
Show Gist options
  • Select an option

  • Save jonashaag/ac839889f5f24dccc0a7776e3300c0a6 to your computer and use it in GitHub Desktop.

Select an option

Save jonashaag/ac839889f5f24dccc0a7776e3300c0a6 to your computer and use it in GitHub Desktop.
Lazy SVG placeholder
// Lazy image placeholder
$('img[data-original],.lazy-background')
.lazyload()
.each(function (_, e) {
// Empty placeholder image so that page does not "jump" while real images are being loaded
e = $(e)
if (!e.loaded) {
const w = e.attr('data-width')
const h = e.attr('data-height')
if (w && h) {
e.attr('src', `data:image/svg+xml;charset=utf-8,%3Csvg width%3D'${w}' height%3D'${h}' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' %2F%3E`)
}
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment