JSFiddle - React, Tailwind, and code Playground

by lonewolfs

HTML

<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css">
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.css">
<script src="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.js"></script>
<div class="fancybox" data-fancybox-href="http://fancyapps.com/" data-fancybox-type="iframe" data-fancybox-group="gallery">
    <img src='http://fancyapps.com/fancybox/demo/1_s.jpg' />
</div>
<div class="fancybox" data-fancybox-href="http://fancyapps.com/fancybox/demo/2_b.jpg" data-fancybox-type="image" data-fancybox-group="gallery">
    <img src='http://fancyapps.com/fancybox/demo/2_s.jpg' />
</div>

CSS

.fancybox {cursor: pointer}

JavaScript

$(".fancybox").fancybox();