I’m looking to implement lazy loading for a single image in a section identified by an ID, using the .lazy() method. The section has a background set through CSS. Here's the current code snippet:
HTML
<section id="showcase">
</section>
CSS
/* Showcase*/
#showcase {
min-height: 400px;
background: url("../img/example.jpg") no-repeat -300px -500px;
background-size: cover;
}
JS
<script>
$(function() {
$("#showcase").lazy();
});
</script>
How do I need to modify the code? It’s currently not functioning as expected. It seems to work only when I include the
<img class="lazy" data-src="../img/example.jpg" />