JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

<img id="card0"  src="http://valtterilaine.bitbucket.org/png/vihainen.png">

CSS

html {
    height: 100%;
}

.zoom {
    transform: scale(1.0);
}

img {
  transform: scale(0.5);
    transform-style: preserve-3d;
    transition: 1s;
}

JavaScript

$(document).ready(function() {
    var zoomed = false;
    var card = $("#card0");
    card.click(function() {
        zoomFunction();
    });

    function zoomFunction() {
        if (zoomed) { //card flipped so front is invisible and back is visible. 
            zoomed = false;
            card.removeClass('zoom');
        } else { //card not flipped so front is visible and back is invisible
            zoomed = true;
            card.addClass('zoom');
        }
    };
});