data-layzr-bg is removed in 2.0.0?
samuelsiau opened this issue · comments
Hi there,
I really like your layzr.js. I hope "data-layzr-bg" feature keep in v2.0.0. ;)
Cheers,
S
@samuelsiau it has been removed in v2, mainly because it conflicts with srcset
support. currentSrc
doesn't work in Safari or IE10/11, so there's no way to determine the truly "best" source for the background image.
luckily, using the src:after
event, you can mimic the behavior. just get the src
attribute, and set it as a background image. sample code below:
instance.on('src:after', element => {
element.style.backgroundImage = `url("${ element.getAttribute('src') }")`
})
Is it just me, or does src:after
fire only when a scroll triggers the lazy loading? I have an image in the viewport on load and it doesn't fire, so I can't set the background image with that method.
@cshold assuming youre using the check
function to load the images in the initial viewport, it should fire. the check
method is the one thats run on scroll - so there should be no difference in its behavior when called manually
Yup, was using:
instance
.update() // track initial elements
.check() // check initial elements
.handlers(true) // bind scroll and resize handlers
Like in your answer to #56
Will keep digging and let you know if I can't figure it out. Cheers.
Yep, that's the correct usage. Try the src:before
event too. The source should be available in that function before it's been set.