JSFiddle - React, Tailwind, and code Playground

by Imri Paloja

HTML

<script src="http://fancyapps.com/fancybox/source/jquery.fancybox.js"></script>
<link rel="stylesheet" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css">
<a rel="gallery" title="Southpark: Reverse Cowgirl" class="fancybox" href="http://i.imgur.com/GhdkYpw.jpg"><img src="http://i.imgur.com/GhdkYpw.jpg" alt=""/></a>

CSS

a {
    text-decoration: none;
    color:#3465A4;
}
a:hover {
    text-decoration:underline;
}
img {
    width:250px;
}

JavaScript

$(".fancybox").fancybox({
    afterLoad: function() {
        this.title = '<a href="' + this.href + '">Download</a> ' + this.title;
    },
    helpers : {
        title: {
            type: 'inside'
        }
    }
});