-2

Not sure why the popup is not working.

Console says:

Uncaught TypeError: Object [object Object] has no method 'magnificPopup' index.html:17

Here's my code:

<!DOCTYPE html>
<html lang="en">

    <head>
        <link rel="stylesheet" type="text/css" href="css/magnific-popup.css" />
        <script src="js/magnific-popup.js"></script>
        <script src="js/jquery.min.js"></script>
    </head>
    <body>
        <a class="demo" href="http://lorempixel.com/50/50">Demo</a>

        <script>
        $(document).ready(function() {

            $('.demo').magnificPopup({
            type: "image",
            });

        });
        </script>
    </body>
</html>
user1441816
  • 859
  • 3
  • 12
  • 24

1 Answers1

2

Include your scripts in reverse order

 <head>
        <link rel="stylesheet" type="text/css" href="css/magnific-popup.css" />
        <script src="js/jquery.min.js"></script>
        <script src="js/magnific-popup.js"></script>
 </head>

jQuery should be always first to include.

And remove that trailing , from the type property

$('.demo').magnificPopup({
    type: "image" // <== comma shouldn't be here since there is nothing to initialize after this
});
Dhaval Marthak
  • 17,246
  • 6
  • 46
  • 68
  • Oh I really apologize. I'm trying to fire the popup and I tried that before but it's not working. And now it's working. :| – user1441816 May 19 '14 at 15:20