这里有灯箱的新手，基本上我们想在查看照片时放置导航箭头，我使用了 https://ashleydw.github.io/lightbox/ 在线的灯箱代码，它有效，但问题是 1。当您单击缩略图时，它将进行预览两次，第二个有很好的导航箭头（我不确定是否有另一个 JS 冲突）和 2. 当您使用导航箭头并单击下一步时，它不会转到下一个图像。 TIA！

页面> http://www.petitgrande.com/pages/rooms/aqua/
图片 > https://imgur.com/w0keOtN

<div class="properties-amenities">
  <div class="main-title-2">
    <h1><span>外観写真ギャラリー</span></h1>
  </div>
  <div class="row" id="imageGallery">
    <h2>外観</h2>
    <div class="clearfix">
      <div class="col-lg-3 col-md-4 col-sm-4 col-xs-6">
        <a href="1.jpg" data-toggle="lightbox" data-gallery="example-gallery">
          <img src="1.jpg" class="img-fluid" />
        </a>
      </div>
      <div class="col-lg-3 col-md-4 col-sm-4 col-xs-6">
        <a href="2.jpg" data-toggle="lightbox" data-gallery="example-gallery">
          <img src="2.jpg" class="img-fluid" />
        </a>
      </div>
      <div class="col-lg-3 col-md-4 col-sm-4 col-xs-6">
        <a href="3.jpg" data-toggle="lightbox" data-gallery="example-gallery">
          <img src="3.jpg" class="img-fluid" />
        </a>
      </div>
      <div class="col-lg-3 col-md-4 col-sm-4 col-xs-6">
        <a href="4.jpg" data-toggle="lightbox" data-gallery="example-gallery">
          <img src="4.jpg" class="img-fluid" />
        </a>
      </div>
    </div>
  </div>
</div>