<script>
  (function(){
window.lazySizesConfig = {
  lazyClass: 'lazy',
  loadMode: 1
}; 
})();
</script>

<div class="main-page-wrapper">
<img data-src="https://highcarbhannah.co/wp-content/themes/plant_web_app/assets/img/hero-back-index.jpg" class="lazy" alt="" />
  
<br><br><br><br><br><br><br><br><br><br><br><br>
  
  <img data-src="https://live.staticflickr.com/65535/48712609183_fe0dcfaed0_k.jpg" class="lazy" alt="" />
<br><br><br><br><br><br><br><br><br><br><br><br>
  <img data-src="https://live.staticflickr.com/610/22832696956_88a25cbaaf_k.jpg" class="lazy" alt="" />
   <br>

  

    </div>
img {
  max-width:100%;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/lazysizes/5.1.2/lazysizes.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js