0

I am beginner and starting use ajax magnific popup. I have downloaded library of magnific pop and created an example to use popup but my problem is when I click the link to pop it display well but I click on popup it hide So I don't wanted it hide. I just wanted click only the black background it hide.

This is my code as following:

index.html 

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="js/jquery.magnific-popup.js"></script>

    <link rel="stylesheet" href="css/magnific-popup.css" />
</head>
<body>

  <div class="example gc3">
    <h3>Ajax popup</h3>
    <div class="html-code">
      <a class="simple-ajax-popup" href="site-assets/test-ajax-2.html" >Load another content via ajax</a>
    </div>
    <script type="text/javascript">
      $(document).ready(function() {

        $('.simple-ajax-popup-align-top').magnificPopup({
          type: 'ajax',
          alignTop: true,
          overflowY: 'scroll' // as we know that popup content is tall we set scroll overflow by default to avoid jump
        });

        $('.simple-ajax-popup').magnificPopup({
          type: 'ajax'
        });

      });
    </script>
  </div>
</body>
</html>

Please help me. Thank you.

Darith
  • 9
  • 7
  • refer to this SO bro, i guess you need to keep only one root node if the `contentType:` is set to `ajax` . ref:http://stackoverflow.com/questions/16600430/magnific-popup-popup-disappearing-on-click – dreamweiver Jun 11 '14 at 06:56
  • Check this link mate.. :) http://stackoverflow.com/questions/18200338/any-click-anywhere-closes-magnific-pop-up-ajax-box?rq=1 – Nibin Jun 11 '14 at 07:01

1 Answers1

0

Add the option modal : true.

$('.simple-ajax-popup').magnificPopup({ type: 'ajax', modal: true });

This should work

Abenitsi
  • 1
  • 1