JSFiddle - React, Tailwind, and code Playground

by IVsevolod

HTML

<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
<script src="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=2.1.5"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=2.1.5">
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css?v=2.1.5">
<script src="http://fancyapps.com/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-buttons.css?v=2.1.5">
<script src="http://fancyapps.com/fancybox/source/helpers/jquery.fancybox-buttons.js?v=2.1.5"></script>
<a class="fancybox-thumb" rel="fancybox-thumb" href="http://farm9.staticflickr.com/8507/8454547519_f8116520e1_b.jpg" title="Ayvalık, Turkey (Nejdet Düzen)">
	<img src="http://farm9.staticflickr.com/8507/8454547519_f8116520e1_m.jpg" alt="" />
</a>
<a class="fancybox-thumb" rel="fancybox-thumb" href="http://farm8.staticflickr.com/7152/6394238505_c94fdd1d89_b.jpg" title="Sicilian Scratches   erice (italianoadoravel on/off coming back)">
	<img src="http://farm8.staticflickr.com/7152/6394238505_c94fdd1d89_m.jpg" alt="" />
</a>
<a class="fancybox-thumb" rel="fancybox-thumb" href="http://farm9.staticflickr.com/8481/8215602321_69d9939b8b_b.jpg" title="The Trail (Msjunior-Check out my galleries)">
	<img src="http://farm9.staticflickr.com/8481/8215602321_69d9939b8b_m.jpg" alt="" />
</a>
<a class="fancybox-thumb" rel="fancybox-thumb" href="http://farm9.staticflickr.com/8200/8220393833_e52cabfe80_b.jpg" title="Trees (Joerg Marx)">
	<img src="http://farm9.staticflickr.com/8200/8220393833_e52cabfe80_m.jpg" alt="" />
</a>

<a id="xx">sfdsdf</a>

JavaScript

$(document).ready(function() {
	$(".fancybox-thumb").fancybox({
		prevEffect	: 'none',
		nextEffect	: 'none',
		helpers	: {
			title	: {
				type: 'outside'
			},
			thumbs	: {
				width	: 50,
				height	: 50
			}
		}
	});
    $("#xx").click(function(){
        $.fancybox.open([{href: "http://farm9.staticflickr.com/8507/8454547519_f8116520e1_m.jpg"}, {href: "http://farm8.staticflickr.com/7152/6394238505_c94fdd1d89_m.jpg"}],{
			thumbs	: {
				width	: 50,
				height	: 50
			}}
                       )});
});