JSFiddle - React, Tailwind, and code Playground
by Josué López
HTML
<script src="http://suprb.com/apps/gridalicious/js/jquery.grid-a-licious.js"></script>
<div id="container">
<div class="item">
<img src="https://c3.staticflickr.com/3/2842/9678323243_4e1a595667_n.jpg" />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
<div class="item">
<img src="https://c1.staticflickr.com/3/2862/9678093470_672575deaa_n.jpg" />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
<div class="item">
<img src="https://c1.staticflickr.com/3/2852/9670082101_2017002539_n.jpg" />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
<div class="item">
<img src="https://c1.staticflickr.com/7/6160/6142653803_f622043b11_n.jpg" />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
<div class="item">
<img src="https://c1.staticflickr.com/7/6078/6132002231_bf57e8010d_n.jpg" />
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
</div>
JavaScript
$(function() {
$("#container").gridalicious({
width: 300,
animate: true,
animationOptions: {
queue: true,
speed: 500,
duration: 400,
effect: 'fadeInOnAppear'
}
});
});