宏伟的弹出窗口：获取“无法加载图像”答案

【问题标题】：Magnific popup: getting “The image could not be loaded”宏伟的弹出窗口：获取“无法加载图像”
【发布时间】：2014-04-24 19:34:41
【问题描述】：

我无法使用华丽的弹出窗口制作画廊。当我点击图片时，我收到“图片无法加载”。

这是列出图片的 html 文件：

<div class='container'>
    <div class='picture'><img src='images/gallery/a.jpg'/></div>
    <div class='picture'><img src='images/gallery/b.jpg'/></div>
    <div class='picture'><img src='images/gallery/c.jpg'/></div>
    <div class='picture'><img src='images/gallery/d.jpg'/></div>
    <div class='picture'><img src='images/gallery/e.jpg'/></div>
</div>

这里是jquery代码：

$.get( 'html/gallery.html', function( data ) {
        $('#page_content').append(data);

        $('.container').magnificPopup({
        type: 'image',
        delegate: 'div',
        gallery:{
            enabled: true,
            navigateByImgClick: true,
            arrowMarkup: '<button title="%title%" type="button" class="mfp-arrow mfp-arrow-%dir%"></button>',
            tPrev: 'Previous (Left arrow key)',
            tNext: 'Next (Right arrow key)',
            tCounter: '<span class="mfp-counter">%curr% of %total%</span>'
        }
    });

我尝试将“delegate”值更改为“div”或“img”，但没有结果。（我关注了这个Magnific popup: getting "The image could not be loaded" and image url is undefined）

感谢您的帮助:)

【问题讨论】：

标签： magnific-popup

【解决方案1】：

问题解决了... Magnific popup 需要一个 href 属性才能工作。

解决方案：

<div class='container'>
    <div class='picture' href='images/gallery/a.jpg'><img src='images/gallery/a.jpg'/></div>
    <div class='picture' href='images/gallery/b.jpg'><img src='images/gallery/b.jpg'/></div>
    ....
</div>

【讨论】：