Hi!
I'm stuck on jquery (as always it seems).
I'm having a campaign landing-page that i'm temporary showing as a modal window instead of the frontpage. I'm using a (well-documented) jquery-plugin (https://github.com/humaan/Modaal)
Everything works fine, but... me (the operator) has halted, and i do have a lot of coffee that i can locate, but... it doesn't help.
I need to close the modal window after the "order"-button has been clicked and the user has been taken to the pre-order site i'm sending them to...
I have added the jquery code on the index-php to open the modal window (In addition to that i'm also calliing the plugin's initialization-script). (The sessionstorage is used to only show the popup-window once per session)
The 'landing_page_bc.html' is just a simple html-page with an image and a button
The documentation of the modal window plugin says that the window is supposed to be able to be closed with
and i really would like the modal window to close after they have clicked the order-button.
That's where i'm stuck. I've tried so many versions, but i can not get it to work!
Can anybody help me out, please ?
I'm stuck on jquery (as always it seems).
I'm having a campaign landing-page that i'm temporary showing as a modal window instead of the frontpage. I'm using a (well-documented) jquery-plugin (https://github.com/humaan/Modaal)
Everything works fine, but... me (the operator) has halted, and i do have a lot of coffee that i can locate, but... it doesn't help.
I need to close the modal window after the "order"-button has been clicked and the user has been taken to the pre-order site i'm sending them to...
I have added the jquery code on the index-php to open the modal window (In addition to that i'm also calliing the plugin's initialization-script). (The sessionstorage is used to only show the popup-window once per session)
- Code: Select all
<!DOCTYPE html>
<html>
<head>
<script src="jquery-3.5.1.min.js"></script>
</head>
<body>
<div class="mytest"></div>
<!-- Campaign landing page -->
<script type="text/javascript">
$(document).ready(function() {
if (typeof window.sessionStorage != undefined) {
if (!sessionStorage.getItem('mySessionVal')) {
jQuery(".mytest").modaal({
type: 'iframe',
fullscreen: 'true',
content_source: 'landing_page_bc.html',
accessible_title: 'iFrame modal title'
});
jQuery('.mytest').modaal('open');
sessionStorage.setItem('mySessionVal', true);
sessionStorage.setItem('storedWhen', (new Date()).getTime());
}
}
});
</script>
<script src="source/js/modaal.js" type="text/javascript"></script>
</body>
</html>
The 'landing_page_bc.html' is just a simple html-page with an image and a button
- Code: Select all
<h2>PRE-ORDER NOW!</h2>
<style type="text/css">
h1.logo {background:url("images/bandcamp-logotype-color-128.png") no-repeat center center;}
</style>
<h1 class="logo" title="Pre-order the album on Bandcamp">
<a href="https://bandcamp.com/" id="btnClosePopup" style="display:block; height:80px; width:350px; text-indent:9999px;">Order</a>
</h1>
The documentation of the modal window plugin says that the window is supposed to be able to be closed with
- Code: Select all
$('.mytest').modaal('close')
and i really would like the modal window to close after they have clicked the order-button.
That's where i'm stuck. I've tried so many versions, but i can not get it to work!
Can anybody help me out, please ?