问如何在滑块中用图像显示图像标题

EN

  <div class="grid-11 left">
        @if (Model.Photos.Count > 0)
        {

            <div style="padding:10px">
                <div class="slide-content" style="max-width:800px">
                    @foreach (var photos in Model.Photos)
                    {
                        <div>
                            <img class="mySlides" src="@Url.Content(photos.photo_url)"/>

                        </div>
                        <span>@photos.photo_caption</span>
                    }
                    <div class="w3-center">
                        <div class="w3-section">
                            <button class="w3-button w3-light-grey" onclick="plusDivs(-1)">❮ </button>
                            <button class="w3-button w3-light-grey" onclick="plusDivs(1)"> ❯</button>
                        </div>
                    </div>
                </div>
             </div>
        }
    </div>

   var slideIndex = 1;
    showDivs(slideIndex);

    function plusDivs(n) {
        showDivs(slideIndex += n);
    }

    function currentDiv(n) {
        showDivs(slideIndex = n);
    }

    function showDivs(n) {
        var i;
        var x = document.getElementsByClassName("mySlides");
        if (n > x.length) {
            slideIndex = 1
        }
        if (n < 1) {
            slideIndex = x.length
        }
        for (i = 0; i < x.length; i++) {
            x[i].style.display = "none";
        }
        x[slideIndex - 1].style.display = "block";
    }