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

本文关键字：滚动 图像 net asp foreach 使用 | 更新日期: 2023-09-27 18:07:55

我正在寻找从这个链接中添加带有箭头的图像滚动的解决方案

<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语法如下所示:

视图。CSHTML - 

@{
    Layout = null;
}

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

现在我如何修改上面的HTML部分来使用li(列表项)和标签，如这个链接

所示

我已经在网上搜索了教程，但所有使用的图像存储在本地系统上。正如你所看到的，我对asp.net的编码了解不多。

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

试试下面这个:

<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>

我假设这是asp.net MVC (.cshtml)，而不是asp.net (.aspx)。

可以直接在foreach

中添加li标签
 @{
        Layout = null;
    }

    <div id="itemView">
        @{
            foreach (var uri in @Model)
            {
             <li>
                <img class="item" src="@uri" />
             </li>
            }
        }
    </div>
相关文章：