Ability to lazy load background images defined in css

[treyrich]

Hi, love the library! I was wondering whether there might be a possible solution to lazy load the background images defined in CSS by using a default image? So what I mean by that is that we would define a default image in the template, and then when the lazy load gets fired instead of switching out the background-image with inline CSS, could we just remove the background-image defining the default and let the site's CSS take over? This would allow for much easier handling of responsive background images, and would remove a lot of unnecessary code from our javascript.

My proposal would be that we could simply do:

<div [defaultImage]="defaultImage" class="some-class"></div>
<style type="text/css">
.some-class {
    background-image: url('http://example.com/my/image.jpg');
}
</style>

So the defaultImage would be shown until time for the lazy loading to take place, at which point it would simply be removed and the CSS would take over.

[tjoskar]

Thanks for your kind words. I agree that it should be posible. Let's continue the discussion in #444