文章/答案/技术大牛

发布

社区首页 >问答首页 >严重的PopUp错误-在新页面上打开

问严重的PopUp错误-在新页面上打开
EN

Stack Overflow用户

提问于 2014-08-19 22:37:10

回答 1查看 1.2K关注 0票数 0

我是一个新手的java脚本代码，虽然有相当好的css和html编码的理解。我很兴奋，为我的网站做了一个magnific弹出窗口的测试，但我似乎不能让它工作。我通读了文档，但我显然还是遗漏了一些东西，因为它是在自己的页面上打开的，而不是停留在同一个url上。我把它放在一个javascript测试站点上，它一直告诉我代码“$(.ready)function() {”有问题。

下面是我所拥有的代码：

<!-- Magnific Popup core CSS file -->
<link rel="stylesheet" href="magnific-popup/magnific-popup.css"> 
<style>

   .image-link {
   cursor: -webkit-zoom-in;
   cursor: -moz-zoom-in;
   cursor: zoom-in;
}

/* aligns caption to center */
.mfp-title {
 text-align: center;
 padding: 6px 0;
 }

</style>

</head>
<body>
<script type="text/javascript">//<![CDATA[
   $(document).ready(function() {
    $('.popup-gallery').magnificPopup({
    delegate: 'a',
    type: 'image',
    tLoading: 'Loading image #%curr%...',
    mainClass: 'mfp-img-mobile',
    gallery: {
        enabled: true,
        navigateByImgClick: true,
        preload: [0,1] // Will preload 0 - before current, and 1 after the current image
    },
    image: {
        tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
        titleSrc: function(item) {
            return item.el.attr('title') + '<small>by Marsel Van Oosten</small>';
        }
    }
});
});
//]]>
</script>

<div class="popup-gallery">
<a href="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_b.jpg" title="The Cleaner">      <img src="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_s.jpg" width="75" height="75"></a>

</div>
<!-- jQuery 1.7.2+ or Zepto.js 1.0+ -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 <!-- Magnific Popup core JS file -->
 <script src="magnific-popup/jquery.magnific-popup.js"></script> 

 </body>
 </html>

任何帮助都将不胜感激！

jquery

html

magnific-popup

javascript

回答 1

Stack Overflow用户

发布于 2014-12-10 19:02:53

看起来你把class属性放错了地方

而不是将其分配给div标记：

<div class="popup-gallery">

将其添加到a标记中：

<div>
  <a class="popup-gallery" href="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_b.jpg" title="The Cleaner">  
    <img src="http://farm9.staticflickr.com/8242/8558295633_f34a55c1c6_s.jpg" width="75" height="75">
  </a> 
</div>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/25386225

复制

相似问题

问严重的PopUp错误-在新页面上打开
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问严重的PopUp错误-在新页面上打开EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问严重的PopUp错误-在新页面上打开
EN