带有asp.net的引导轮播不起作用

Question

我在 asp.net 中使用引导轮播滑块。我想做中继器控制轮播滑块。但不工作。我该怎么办。

<div class="slider">
    <div class="container">
        <div id="about-slider">
            <div id="carousel-slider" class="carousel slide" data-ride="carousel">
                <!-- Indicators -->
               <ol class="carousel-indicators visible-xs">
                    <li data-target="#carousel-slider" data-slide-to="0" class="active"></li>
                    <li data-target="#carousel-slider" data-slide-to="1"></li>
                    <li data-target="#carousel-slider" data-slide-to="2"></li>
                </ol>
                <div class="carousel-inner">
                     <div class="item active">
                        <asp:Repeater ID="Repeater1" runat="server">
                            <ItemTemplate>                                  
              <img src='/resimler/<%#Eval("SliderResim")%>' class="img-responsive" alt="">       
                            </ItemTemplate>
                        </asp:Repeater>
                    </div>
                   </div>
                <a class="left carousel-control hidden-xs" href="#carousel-slider" data-slide="prev">
                    <i class="fa fa-angle-left"></i>
                </a>
                <a class="right carousel-control hidden-xs" href="#carousel-slider" data-slide="next">
                    <i class="fa fa-angle-right"></i>
                </a>
            </div>
            <!--/#carousel-slider-->
        </div>
        <!--/#about-slider-->
    </div>
</div>

Answer 1

你的中继器有一个小错误。 <div class="item active"> 必须与内容一起在您的 <ItemTemplate> 内。 是 div 和 .item 类在轮播上制作幻灯片。

但要小心，只有一个 div 必须有.active，表示应该显示哪个 div。其他 div 应该只有 .item 类，因为轮播控件会在用户与轮播交互时动态更改 .active 类。

使用第一个索引设置.active 类的简单示例，否则仅设置.item。

<div class="slider">
<div class="container">
    <div id="about-slider">
        <div id="carousel-slider" class="carousel slide" data-ride="carousel">
            <!-- Indicators -->
           <ol class="carousel-indicators visible-xs">
                <li data-target="#carousel-slider" data-slide-to="0" class="active"></li>
                <li data-target="#carousel-slider" data-slide-to="1"></li>
                <li data-target="#carousel-slider" data-slide-to="2"></li>
            </ol>
            <div class="carousel-inner">
                    <asp:Repeater ID="Repeater1" runat="server">
                        <ItemTemplate>
                    <div <%# Container.ItemIndex == 0 ? "class=\"item active\"" : "class=\"item\"" %>>
                    <img src='/resimler/<%#Eval("SliderResim")%>' class="img-responsive" alt="">
                    </div>    
                        </ItemTemplate>
                    </asp:Repeater>
               </div>
            <a class="left carousel-control hidden-xs" href="#carousel-slider" data-slide="prev">
                <i class="fa fa-angle-left"></i>
            </a>
            <a class="right carousel-control hidden-xs" href="#carousel-slider" data-slide="next">
                <i class="fa fa-angle-right"></i>
            </a>
        </div>
        <!--/#carousel-slider-->
    </div>
    <!--/#about-slider-->
</div>