c# - 使用foreach在asp.net中滚动图像

Question

我正在寻找添加带有箭头的图像滚动的解决方案 this link

<div class="bloc_1_edito">
<div id="nav_container">
<div id="next_nav">></div>
<div id="prev_nav"><</div>
<div id="nav">

        <li class="activeSlide">
            <a href="#">
                <img class="image_thumbnails" src="http://galaxyfoot.soixanteseize-lab.com/wp-content/uploads/image_edito1.jpg"></img>
            </a>
        </li>

但对于我的元素，我的图像来自 windows azure，所以我使用 foreach 语法，如下所示:

view.cshtml -

@{
    Layout = null;
}


<div id="itemView">
    @{
        foreach (var uri in @Model)
        {
            <img class="item" src="@uri" />

        }
    }
</div>

现在我该如何修改上面的 HTML 部分以使用 li(列表项)和标签，如 this link 中所示

我在网上搜索教程，但所有教程都使用存储在系统本地的图像。如您所见，我不太了解 asp.net 中的编码。

如有任何帮助，我们将不胜感激。

Answer 1

试试下面的:

<div class="bloc_1_edito">
<div id="nav_container">
    <div id="next_nav">></div>
    <div id="prev_nav"><</div>
    <div id="nav">
    @{
        var index=0;
        foreach (var uri in @Model)
        {
            if(index==0)//check if it is first image
            {
               <li class="activeSlide"> //If yes add activeSlide to first li
                   <a href="#">
                      <img class="image_thumbnails" src="@uri"/>
                  </a>
               </li>
            }
            else
            {
               <li>
                   <a href="#">
                      <img class="image_thumbnails" src="@uri"/>
                  </a>
               </li>
            }
            index++;
        }
    }
    </div>
</div>