JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://thindery.com/jsfiddle/jquery.iviewer.js"></script>
<script src="http://thindery.com/jsfiddle/jquery.mousewheel.min.js"></script>
<h1>JQuery.iviewer test</h1>
        <!-- wrapper div is needed for opera because it shows scroll bars for reason-->
<div class="wrapper">
    <div id="viewer2" class="viewer"></div>
</div>
<br />                  
<br />   
<span id="status">Display Coordinates Here</span>

CSS

.viewer
{
    border: 0px solid black;
    background-color: blue;
    position: absolute;
    left:0; top:0;
    height:215.931px;
    width:504px;
    z-index: 50;
}

.wrapper
{
    z-index: 0;
    position: relative;
    height:215.931px;
    width:504px;
    display: block;
}

.iviewer_common {
    position: absolute;
    bottom: 5px;
    border: 1px  solid #000;
    height: 28px;
    z-index: 5000;
}

.iviewer_cursor {
    cursor: url('http://thindery.com/jsfiddle/img/hand.cur') 6 8, pointer;
}

.iviewer_drag_cursor {
    cursor: url('http://thindery.com/jsfiddle/img/grab.cur') 6 8, pointer;
}

.iviewer_button {
    width: 28px;
    cursor: pointer;
    background-position: center center;
    background-repeat: no-repeat;
}

.iviewer_zoom_in {
    left: 20px;
    background: url('http://thindery.com/jsfiddle/img/iviewer.zoom_in.gif');
}

.iviewer_zoom_out {
    left: 55px;
    background: url('http://thindery.com/jsfiddle/img/iviewer.zoom_out.gif');
}

.iviewer_zoom_zero {
    left: 90px;
    background: url('http://thindery.com/jsfiddle/img/iviewer.zoom_zero.gif');
}

.iviewer_zoom_fit {
    left: 125px;
    background: url('http://thindery.com/jsfiddle/img/iviewer.zoom_fit.gif');
}

.iviewer_zoom_status {
    left: 160px;
    font: 1em/28px Sans;
    color: #000;
    background-color: #fff;
    text-align: center;
    width: 60px;
}

.iviewer_rotate_left {
    left: 227px;
    background: #fff url('http://thindery.com/jsfiddle/img/iviewer.rotate_left.png') center center no-repeat;
}

.iviewer_rotate_right {
    left: 262px;
    background: #fff url('http://thindery.com/jsfiddle/img/iviewer.rotate_right.png') center center no-repeat;
}

JavaScript

//Source: https://github.com/can3p/iviewer/wiki

$(document).ready(function() {
    var iv2 = $("#viewer2").iviewer({
        src: "http://www.hdwallpapersimages.com/wp-content/uploads/2014/01/Winter-Tiger-Wild-Cat-Images.jpg",
        onDrag: function() {
            var pos = $("img","#viewer2").position();
            $("#status").html('X : '+Math.abs(pos.left)+'<br>Y :'+Math.abs(pos.top));
        }
    });
});