JSFiddle - React, Tailwind, and code Playground

by Hugo Carneiro

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/1.7.9/jquery.lazy.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazy/1.7.9/jquery.lazy.plugins.min.js"></script>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
  Hello
</div>
<div class="element">
 ...

CSS

.element {
  background-color: #fff;
  padding: 15px;
  border-radius: 20px;
  box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);
  margin-bottom: 25px;
}

JavaScript

$('.element').Lazy({
  beforeLoad: function(element) {
    console.log('Element loaded');
  },
  afterLoad: function(element) {
    console.log('Element loaded');
  },
  onError: function(element) {
    console.log('Element loaded');
  },
  onFinishedAll: function() {
    console.log('Element loaded');
  }
});