Question

我无法使用Magnific Popup（js noob）

嘿伙计们，我讨厌提出这样的问题，但我已经没有选择了。我按照文档，以及几个Youtube视频和StackOverflow线程，但我显然遗漏了一些东西。我尝试了几个人推荐的初始化脚本，但这对我也没有帮助。目前，当我点击图片时，href工作（我带到了带图片的页面），但Magnific没有。

<div class="container">
    <a id="homegallery1" href="http://placehold.it/250x250"><img src="http://placehold.it/150x150" class="magnificpic" /></a>
</div>

CSS链接：

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

JS链接：

/* JS */
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="js/magnific-popup.js"></script>

初始化脚本：

<!------------------------------
 Script To Call Gallery On Click
-------------------------------->
<script>
    // Example with multiple objects
    $('#homegallery1').magnificPopup({
    items: [
      {
        src: 'http://placehold.it/350x250'
      },
      {
        src: 'http://placehold.it/250x350'
      },
      {
        src: 'http://placehold.it/350x350'
      },
    ],
    gallery: {
      enabled: true
    },
    type: 'image' // this is default type
});
</script>

的jsfiddle： http://jsfiddle.net/CSS_Apprentice/4coo0mxn/3/

Answer 1

等待文档就绪部分似乎缺少您的脚本。

 $(document).ready(function(){

    // jQuery methods go here...
    // try placing your ('#homegallery1').magnificPopup in here

 });

http://www.w3schools.com/jquery/jquery_syntax.asp

Answer 2

问题是在添加javascript和css文件时混合使用http和https协议。此外，JSFIDDLE似乎与Chrome浏览器有问题。请参阅https://github.com/maksa9/magnific-popup/。在我的Chrome中工作。

我不能让Magnific Popup工作（js noob）

2 个答案: