JSFiddle - React, Tailwind, and code Playground

by Omar X

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
<div data-role="page">
    <div data-role="content"> <a href="#" data-role="button" class="image_link">Open popup</a>

    </div>
    <div data-role="popup" id="show_image" data-theme="c" class="ui-corner-all">
        <div style="padding:20px 30px;">
            <img id="show_image_img" src="" />
        </div>
    </div>
</div>

JavaScript

$(document).on("pageshow", function () {
    $('.image_link').on('click', function (event) {
        $("#show_image_img").attr("src", "http://www.aai.ee/planets/nineplanets/gif/SmallWorlds.jpg");
        $("#show_image")
            .popup("open")
            .on("popupafteropen", function () {
            $(this)
                .popup("reposition", {
                "positionTo": "window"
            });
        });
    });
});