JSFiddle - React, Tailwind, and code Playground
HTML
<div data-role="page">
<div data-role="popup" id="popupBasic">
<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a><img id="imgView" />
</div>
<button class="ui-btn" onclick="btnViewPopup()">View</button>
</div>
CSS
#imgView
{
width: 100%;
height: 100%;
}
JavaScript
function btnViewPopup() {
localStorage.imageURL = 'http://icons.iconarchive.com/icons/jonathan-rey/simpsons/256/Homer-Simpson-04-Happy-icon.png';
try {
if (localStorage.imageURL == undefined || localStorage.imageURL.length == 0 || localStorage.imageURL == "undefined") {
Notify(22);
}
else {
var source = localStorage.imageURL;
$("#imgView").attr('src', source);
$("#imgView").one("load", function() {
$("#popupBasic").popup("open");
}).each(function() {
if (this.complete) {
$(this).load();
}
});
}
}
catch (err) {
ErrorMessageDB("Issue Attachments", "btnAttViewClick", "", "click-to view attachment", err.message, localStorage.EmployeesKId4LastModifiedBy);
}
}