Magnific-Popup Gallery 不会打开两次
Posted
技术标签:
【中文标题】Magnific-Popup Gallery 不会打开两次【英文标题】:Magnific-Popup Gallery don't open twice 【发布时间】:2019-06-01 00:29:33 【问题描述】:我想从缩略图列表中打开一个宏伟的弹出式画廊。
画廊打开一次,一切正常,但如果我关闭画廊,我无法打开两次,我有这个错误:
未捕获的类型错误:无法读取未定义的属性“顶部”
magnific-popup.js 中这一行的错误报告: offset.top -= ( $(window).scrollTop() - paddingTop );
<div id="filelist">
<div id="156" class="entreprise_img" style="background: url('5c30ff09d7566.jpg') no-repeat center;-moz-background-size: cover;-webkit-background-size: cover;background-size: cover;">
<a href="#" class="entreprise_photo_btn_delete" title="Supprimer">Supprimer</a>
<a href="5c30ff09d7566.jpg" class="magnific-gallery" style="position: absolute; bottom: 0;">VOIR</a>
</div>
<div id="157" class="entreprise_img" style="background: url('5c3104cab1fb7.jpg') no-repeat center;-moz-background-size: cover;-webkit-background-size: cover;background-size: cover;">
<a href="#" class="entreprise_photo_btn_delete" title="Supprimer">Supprimer</a>
<a href="5c3104cab1fb7.jpg" class="magnific-gallery" style="position: absolute; bottom: 0;">VOIR</a>
</div>
</div>
$('#filelist').each(function()
$(this).magnificPopup(
delegate: '.magnific-gallery',
type: 'image',
closeOnContentClick: false,
closeBtnInside: false,
mainClass: 'mfp-with-zoom mfp-img-mobile',
image:
verticalFit: true
,
gallery:
enabled: true
,
zoom:
enabled: true,
duration: 300, // don't foget to change the duration also in CSS
opener: function(element)
return element.find('img');
);
);
【问题讨论】:
删除缩放选项后一切正常。 【参考方案1】:我也有类似的错误。解决方法很简单:你需要重写 zoom 属性中的 opener 方法,让它检查被打开的对象是否是图像。
zoom:
enabled: true,
duration: 300,
opener: function (element)
return element.is('img') ? element : element.find('img');
【讨论】:
保护程序只使用:opener: function(element) return element;
。见github.com/dimsemenov/Magnific-Popup/issues/…以上是关于Magnific-Popup Gallery 不会打开两次的主要内容,如果未能解决你的问题,请参考以下文章
如何让 magnific-popup 打开内联库中的选定项目?
html 使用Magnific-Popup JS的两个选项(Django模板)