Blueimpカルーセルにカルーセルとその下の画像が表示されます

Question

私はギャラリーページにブルーインペアカルーセル（2.22.0）を実装しました。それはうまく動作し、カルーセルの画像を表示しています。しかし、それはまた、カルーセルの下のすべての画像を準ライトボックススタイルで表示しています。これは私のコードです。

<link href="~/Content/Css/blueimp-gallery.min.css" rel="stylesheet" /> 

<div class="page-header"> 
    <h2>@Model.Name</h2> 
</div> 


<!-- The Gallery as inline carousel, can be positioned anywhere on the page --> 
<div id="blueimp-gallery-carousel" class="blueimp-gallery blueimp-gallery-carousel"> 
    <div class="slides"></div> 
    <h3 class="title"></h3> 
    <a class="prev">‹</a> 
    <a class="next">›</a> 
    <a class="play-pause"></a> 
    <ol class="indicator"></ol> 
</div> 
<div id="links"> 

    @foreach (GalleryViewItemVM item in Model.Images) 
    { 
     <a href="@item.ImagePath" title=""> 
      <img src="@item.ThumbPath" alt=""> 
     </a> 
    } 
</div> 


<script src="~/Scripts/blueimp-gallery.min.js"></script> 

<script> 
    blueimp.Gallery(
     document.getElementById('links').getElementsByTagName('a'), 
     { 
      container: '#blueimp-gallery-carousel', 
      carousel: true 
     } 

    ); 
</script> 

私は剃刀とブーツストラップ3を使用していますが、これは関係ないと思います。

Answer 1

<a>タグ内の<img>タグが不必要であり、望ましくない動作を引き起こしています。