My website popup features a 'Close' button in the top right corner, a text section with a background image, and a 'Print' button at the bottom. The popup automatically appears when the page loads. However, once closed, there is currently no way to reopen it without refreshing the page. I have been attempting to make the popup reappear when the user presses either the letter 'G' or 'g,' but so far I have been unsuccessful. I came across this resource which I believe could be integrated into my existing code, though I have struggled to do so.
It's important to note that I would prefer to utilize the current functionality within the JS code rather than relying on an external plugin that needs to be downloaded. Below is the snippet of my code:
$(document).ready(function() {
$(function(){
$('#PopUp').css("visibility", "visible");
$('#PopUp').css("opacity", 1);
});
$( ".close" ).click(function() {
$('#PopUp').css("visibility", "hidden");
$('#PopUp').css("opacity", 0);
});
});
function printDiv()
{
var content = document.getElementById('printableDiv').innerHTML;
var win = window.open();
win.document.write(content);
win.print();// JavaScript Print Function
win.close();//It will close window after Print.
document.getElementById("pdf1").style.top=117 + "px";
}
.t {
-webkit-transform-origin: top left;
-moz-transform-origin: top left;
-o-transform-origin: top left;
-ms-transform-origin: top left;
-webkit-transform: scale(0.25);
-moz-transform: scale(0.25);
-o-transform: scale(0.25);
-ms-transform: scale(0.25);
z-index: 2;
position: absolute;
white-space: pre;
overflow: visible;
}
#t1_1{left:256px;top:35px;letter-spacing:0.1px;}
#t2_1{left:334px;top:87px;word-spacing:-0.1px;}
...
</div>
</div>
</div>