JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//rawgit.com/sindresorhus/screenfull.js/gh-pages/src/screenfull.js"></script>
<div class="imageContainer1">
<div class="imageContainer2">
<img src="http://dummyimage.com/1900x400/ffffff/000000" />
</div>
</div>
CSS
div.imageContainer1 {
text-align: center;
}
.imageContainer2 img {
display: block;
width: 200px;
}
div.imageContainer2 {
position: relative;
display: inline-block;
/* if you need ie6/7 support */
*display: inline;
zoom: 1;
}
JavaScript
$(document).on("click", ".imageContainer", function (e) {
if (screenfull.enabled) {
alert("fff");
// We can use `this` since we want the clicked element
screenfull.toggle($(this)[0]);
}
});