Pop-up not showing (with magnific-popup)

Question

I\'m trying to implement magnific popup on my website but for some reason my test image is not opening in popup mode. What could be the issue? Many thanks

&l         


        

Answer 1

Problem in your code:

 $(document).ready(function() {
    $('.image-popup-vertical-fit').magnificPopup({
      type: 'image',
      closeOnContentClick: true,
      mainClass: 'mfp-img-mobile',
      image: {
        verticalFit: true
      }
 });

Your problem, you have two opening script tags: });

The proper version of script:

$(document).ready(function() {
    $('.image-popup-vertical-fit').magnificPopup({
      type: 'image',
      closeOnContentClick: true,
      mainClass: 'mfp-img-mobile',
      image: {
        verticalFit: true
      }
  });
});

Answer 2

you should put

(document).ready(function()

inside the body, not the head

Answer 3

Look at the JavaScript console. You got an error.

Uncaught SyntaxError: Unexpected token < testpopup.html:14

Click on the error message and it takes you to

<script type="text/javascript">
<script type="text/javascript">

There is your problem, you have two opening script tags.