燈箱按相反順序加載圖像

我在引導版本中使用燈箱。我已經將一組圖像添加爲基本圖像的錨點標記。但是，當單擊基本圖像時，加載到燈箱中的圖像從「6的圖像6」開始。無論我在圖像上使用哪些數字，它總是會加載「6中的圖像6」。這意味着用戶需要在圖像中向後循環。我所需要的只是加載到「Image 1 of 6」。燈箱按相反順序加載圖像

<div class="row"> 
 
    <div class="col-lg-4 col-sm-6 wow fadeInUp" data-wow-delay=".3s"> 
 
    <a href="img/portfolio/image-1/1.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/2.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/3.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/4.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/5.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/6.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
     <img src="img/portfolio/1.jpg" class="img-responsive" alt="###"> 
 
     <div class="portfolio-box-caption"> 
 
      <div class="portfolio-box-caption-content"> 
 
      <div class="project-category text-faded">Category</div> 
 
      <div class="project-name">Project Name</div> 
 
      </div> 
 
     </div> 
 
    </a> 
 
    </div> 
 
</div>

來源

2017-01-02 Wayne

原來，圖像標記指示收藏夾錨定圖象的基礎上，在那裏它被定位。因此，將與其關聯的div標籤的圖像標籤移動到第一個錨標籤下方即可解決問題。現在圖像加載正確（圖1的6）。

<div class="row"> 
 
    <div class="col-lg-4 col-sm-6 wow fadeInUp" data-wow-delay=".3s"> 
 
    <a href="img/portfolio/image-1/1.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
     <img src="img/portfolio/1.jpg" class="img-responsive" alt="###"> 
 
     <div class="portfolio-box-caption"> 
 
      <div class="portfolio-box-caption-content"> 
 
      <div class="project-category text-faded">Category</div> 
 
      <div class="project-name">Project Name</div> 
 
      </div> 
 
     </div> 
 
    <a href="img/portfolio/image-1/2.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/3.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/4.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/5.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    <a href="img/portfolio/image-1/6.jpg" class="portfolio-box" data-lightbox="image-1" data-title="Your caption"> 
 
    </a> 
 
    </div> 
 
</div>

來源

2017-01-08 08:25:01 Wayne

燈箱按相反順序加載圖像

回答

相關問題