<div class="wrapper">
  <img class="lazyload" data-src="/images/01.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/02.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/03.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/04.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/05.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/06.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/07.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/08.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/09.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/10.jpg" width="960" height="593" alt=""> 
  <img class="lazyload" data-src="/images/large/11.jpg" 
       data-srcset="/images/small/11.jpg 640w, 
                    /images/medium/11.jpg 960w, 
                    /images/large/11.jpg 1200w" 
       data-sizes="auto"
       alt=""> 
  <picture>
    <source media="(min-width: 1200px)" data-srcset="/images/large/12.jpg">
    <img class="lazyload" data-src="/images/12.jpg" alt="">
  </picture> 
</div>

<script src="lazysizes-intersection.js"></script>