JSFiddle - React, Tailwind, and code Playground

by BenjaminRay

HTML

<img id="img1" src="http://placehold.it/300x200" onMouseOver="doFlip(true)" onMouseOut="doFlip(false)">
<img id="img2" src="http://placehold.it/200x200" onMouseOver="doFlip(true)" onMouseOut="doFlip(false)">
<script>
    var img1 = document.getElementById("img1");
    var img2 = document.getElementById("img2");
    var img1path = "http://placehold.it/300x200";
    var img2path = "http://placehold.it/200x200";

    function doFlip(isOn) {
        if (isOn) {
            img1.src = img2path;
            img2.src = img1path;
        } else {
            img1.src = img1path;
            img2.src = img2path;
        }
    }
</script>