lightGallery动态模式不适用于Firefox和Safari

lightGallery dynamic mode not working with Firefox and Safari

本文关键字：Firefox Safari 适用于 不适用 动态 模式 lightGallery      更新时间：2024-05-07

我设置了这个代码来生成一个包含34张图像的图像库库：

$(document).ready(function (){
  $('#view-gallery').on('click', function() {
    $(this).lightGallery({
      dynamic: true,
      dynamicEl: [{
        "src": '../images/gallery/01_SL_01.jpg',
        'thumb': '../images/gallery/01_SL_01.jpg',
        'subHtml': "<div>Leather-bound miniature volume from an edition of The Merchant of Venice printed in the early 20th century to promote a chocolate company.<br/><em>Photo by Shane Lin.</em> </div>"
      }, {
        'src': '../images/gallery/02_UVALD_03.jpg',
        'thumb': '../images/gallery/02_UVALD_03.jpg',
        'subHtml': "<div>&quot;Hang there my verse, in witness of my love&quot;—page from an elaborately illustrated edition of <em>As You Like It: a Pleasant Comedy newly embellished with sundry decorations by W. H. Low</em> (1900). Low was a celebrated interior design artist who had decorated New York’s Waldorf Astoria.<br/><em>Image: UVA Library Digital Production Group.</em></div>"
      }, { 
      ...     
      }, {
        'src': '../images/gallery/34_SL_34.jpg',
        'thumb': '../images/gallery/34_SL_34.jpg',
        'subHtml': "<div>Minute page ornamentation from miniature volume of <em>Shakespeare’s Sonnets</em> (2000).<br/><em>Photo by Shane Lin.</em></div>"
      }]
    })
  });
});

当有人点击此链接时，它会被调用：<div class="exhibit-link"><a id="view-gallery" href="">View Gallery</a></div>

但该链接仅适用于Chrome浏览器。当在其他浏览器中单击时，库看起来会显示出来，因为有一段时间你可以看到第一个图像出现在覆盖中，但随后它消失了。在lightGallery文档中，我没有看到任何内容表明我的配置中缺少了什么。但我想知道是否有其他人看到了这个问题并找到了解决方案。感谢

解决方案是确保浏览器不会尝试转到href位置，即使它是空的。空的href基本上将重新加载页面。将链接代码更改为

<a id="view-gallery" href="javascript:void(0)">View Gallery</a>

阻止Firefox和Safari尝试重新加载页面。因此，onclick事件被执行并工作。

相关文章：