Magnific Popup: How to add a custom close button inside a popup form?

jquery, magnific-popup

Solution

If your snippet is located in your main js, the ajax popup button may not be binded to the event. I imagine two solutions :

Use "on" instead of "click" :(not tested)

$('#close').on( "click", function() {
  $.magnificPopup.close();
});

Or do it that way : (tested)

add this function in your main js

function closePopup() {
  $.magnificPopup.close();
}

And use this kind of button in your popup html

<button type="button" onClick="closePopup();">Close</button>

Iframe :

If your button is located in an iframe and the magnificpopup script in the main window, on the same domain, you can access the above function like this :

<button type="button" onClick="parent.closePopup();">Close</button>

Problem

I have a form that opens up on a popup and have added a custom `close button` next to a submit button. This is a jQuery I am using for the close button: ``` $(document).ready(function() { $('#close').click(function() { $.magnificPopup.close(); }); }); ``` However this does not seem to work. Does anyone know how to do this?

Original source