NanoGallery2如何配置实现页面加载时自动触发lightbox灯箱

问题原因 #

你将openOnStart配置项错误嵌套在thumbnailLabel配置组内，该参数是NanoGallery2的顶层全局配置，调整配置层级即可生效。

修正后的代码 #

<div ID="ngy2p" data-nanogallery2='{
    "thumbnailWidth": "200",
    "openOnStart": "ID1",
    "thumbnailLabel": {
      "position": "overImageOnBottom",
      "display": false,
      "titleMultiLine": true,
      "descriptionMultiLine": true
    },
    "thumbnailHoverEffect2":  "imageScale150|imageScale150",
    "thumbnailAlignment": "center",
    "displayBreadcrumb": false,
    "thumbnailOpenImage": true
  }'>

 <a href="/uploads/gallery/F9GEO.JPG" data-ngid="ID1"  
target="_blank" data-ngdesc=""><img src="/uploads/gallery/thumbs/F9GEO.JPG" 
border="0" alt="" /></a>

    
    <a href="/uploads/gallery/zQsFE.JPG" data-ngid="ID2"  
target="_blank" data-ngdesc=""><img src="/uploads/gallery/thumbs/zQsFE.JPG" 
border="0" alt="" /></a>


</div>

备选兼容方案 #

如果调整配置后仍未生效，可以在页面加载完成后手动调用NanoGallery2的API触发打开指定图片：

// 等待页面所有资源加载完成后执行
window.addEventListener('load', function() {
  jQuery("#ngy2p").nanogallery2('openItem', 'ID1');
})

内容的提问来源于stack exchange，提问作者kneidels