JSFiddle - React, Tailwind, and code Playground

by Denis

HTML

<link rel="stylesheet" href="http://nivozoom.dev7studios.com/styles/nivo-zoom.css">
<script src="http://nivozoom.dev7studios.com/scripts/jquery.nivo.zoom.pack.js"></script>
<link rel="stylesheet" href="http://nivozoom.dev7studios.com/style.css">
<div id="main">
    <a href="http://nivozoom.dev7studios.com/images/monstersinc_large.jpg" class="nivoZoom">
        <img src="http://nivozoom.dev7studios.com/images/monstersinc.jpg" alt="">
    </a>
    <a href="http://nivozoom.dev7studios.com/images/nemo_large.jpg" class="nivoZoom">
        <img src="http://nivozoom.dev7studios.com/images/nemo.jpg" alt="">
    </a>
    <a href="http://nivozoom.dev7studios.com/images/walle_large.jpg" class="nivoZoom">
        <img src="http://nivozoom.dev7studios.com/images/walle.jpg" alt="">
    </a>
</div>

CSS

#main {
    margin: 200px 20px;
}

JavaScript

$('body').nivoZoom({
    speed:500,
    zoomHoverOpacity:0.8,
    overlay:false,
    overlayColor:'#333',
    overlayOpacity:0.5,
    captionOpacity:0.8
});