CODEWITHSUNDEEP
javascriptjqueryhtmlpopupmagnific-popup
Hassan Sardar
Hassan Sardar

Reputation: 4523

Onclick anywhere on page close popup - Magnific Popup

I am using Magnific Popup.

I want to close popup when click anywhere on page close popup.

Here is my code fiddle:

http://jsfiddle.net/qweWa/24/

Code :

$('.popup-modal').magnificPopup({

    type: 'inline',
    modal: true,

});

$(document).on('click', '.closePopup', function (e) 
            {
                e.preventDefault();
                $.magnificPopup.close();
});

Upvotes: 0

Views: 6502

Answers (4)

Jennis Vaishnav
Jennis Vaishnav

Reputation: 341

From Magnific-Popup Documentation There's actually no need to set modal:false explicitly. Which most of the answers have done.

If you go through the documentation you'll find that, If you don't even pass the modal attribute it work. I've edited JSFiddle as per your requirement. I think unnecessary override a attribute can be avoided in this case.

Just these would be fine:

$('.popup-modal').magnificPopup({
    type: 'inline',
});

Note: Don't forget to note the difference of this answer with another answers.

Upvotes: 0

Nevin
Nevin

Reputation: 3298

Slight adjustment ,check fiddle :)

$('.popup-modal').magnificPopup({

type: 'inline',
modal: false,

});

> $(document).on('click', '.closePopup', function (e) 
>             {
>                 e.preventDefault();
>                 $.magnificPopup.close();
>             });

http://jsfiddle.net/qweWa/27/

Upvotes: 2

TechFreak
TechFreak

Reputation: 418

modal: When set to true, the popup will have a modal-like behavior: it won’t be possible to dismiss it by usual means (close button, escape key, or clicking in the overlay).

$('.popup-modal').magnificPopup({

    type: 'inline',
    modal: false

});

Upvotes: 0

Quinn
Quinn

Reputation: 458

You need to set modal: false

Demo Fiddle

Upvotes: 2

Related Questions