close popup automatically

0
hai all, i have a notification popup page, after opening the popup page i want to close the page when the user clicks anywhere outside of the popup surface. how can I do  this ? thanks in advance.
asked
3 answers
8

You could create an overlay container: put it in your pop-up and add an on-click action to close the page. then add this styling on the container:

z-index: -10;
width: 100vw;
height: 100vh;
background-color: transparent;
position: fixed;
left: 0;
top: 0;

Make sure to put a z-index value on the pop-up itself that is higher than the value above here. This should work, let me know if you need more help.

answered
0

There might be a better solution, but this works. Call a JavaScript Action before opening the page. Then add a .btn-close class to whatever button you want to trigger to close the page. If you don't want the button to be visible to the user, also add the hidden class.

document.addEventListener("click", function(e) {
   if(e.target.className === "mx-underlay") 
       document.getElementsByClassName("btn-close")[0].click();
});

 

answered
0

Hi,

 

You can use the javascript for this action.

$("body").click(function(){
  $(".modal-dialog").fadeOut();
$(".mx-underlay").fadeOut();
});

Thanks,

Rasik.N

answered