bxSlider以正确的顺序显示照片

Question

照片是从DB MVC5加载的，所以我有一个用于照片的boxslider和一个用于他们的小coppies的寻呼机作为可点击的预览。它工作，但不正确，如果我点击预览，它显示不正确的照片（通常一个或停止工作）。 HTML：

    <div class="slideimg">
    <ul class="bxslider2 bxslider-mobile">
        @foreach (GalleryModel gal in Model.Gallery)
        {
            <li><img style="width: 1050px;" src="@($"data:image;base64,{Convert.ToBase64String(gal.Image)}")"/></li>
        }
    </ul>
    <div class="pager" style="height: 500px">
        <div id="bx-pager">
            @{
                int a = 1; //z-order 
            }
            @foreach (GalleryModel gal in Model.Gallery)
            {

                <a data-slide-index=@a href=""><img src="@($"data:image;base64,{Convert.ToBase64String(gal.Image)}")" /></a>
                a++;
            }
        </div>
    </div>
</div>

这是从db添加3张照片后的样子： screenshot of result

我想也许应该用寻呼机的z顺序改变一些东西。