Question

这是我的转盘。

<div class="modal-body mbody">
 <asp:UpdatePanel ID="UpdatePanel4" runat="server">
  <ContentTemplate> 
  <div id="myCarousel" class="carousel slide">

   <ol class="carousel-indicators">
   <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
   <li data-target="#myCarousel" data-slide-to="1"></li>
   <li data-target="#myCarousel" data-slide-to="2"></li>
   </ol> 

 <div class="carousel-inner">
 <asp:Repeater ID="repid" runat="server">
  <ItemTemplate>
  <img alt="" style='height: 275px; width: 275px' src='<%# Eval("imgPath") %>' />
  </ItemTemplate>
  </asp:Repeater>
  </div>

  </div>

  </ContentTemplate>
  </div>

这是我的.cs部分。我已将此事件包含在pageload中。我的意思是转发器与数据库捆绑在一起。

public void bindslide()
{
    //string str = Session["userid"].ToString();
    string str = "22";
    sq.connection();
    SqlCommand cmd = new SqlCommand("select * from mygallary where regId_img='" + str + "' ", sq.con);
    SqlDataAdapter da = new SqlDataAdapter(cmd);
    DataSet ds = new DataSet();
    da.Fill(ds);
    repid.DataSource = ds;
    repid.DataBind();

    sq.con.Dispose();
    sq.con.Close();

}

图像是并排加载而不是滑动。我哪里出错？

修改这就是我得到的。

enter image description here

Answer 1

根据此链接：http://webdesign.tutsplus.com/articles/twitter-bootstrap-101-the-carousel--webdesign-7442每个轮播项目的内容应使用div类item打包。我首先修改你的代码：

  <div class="carousel-inner">
    <asp:Repeater ID="repid" runat="server">
      <ItemTemplate>
         <div class='item'>
           <img alt="" style='height: 275px; width: 275px' src='<%# Eval("imgPath") %>' />
         </div>
      </ItemTemplate>
    </asp:Repeater>
  </div>

Answer 2

您的代码中缺少item和item active类。您可以修改转发器并分别在<div class='item'>内添加<div class='item active'>和ItemTemplate。

<asp:Repeater ID="repid" runat="server">
<ItemTemplate>
 <div class="item" >
  <div class="item active">
   <asp:Image ID="imgId" runat="server" ImageUrl='<%#Eval("imgPath") %>' />
  </div>
 </div>
</ItemTemplate>
</asp:Repeater>

有关详情，请参阅https://unschoolingcode.wordpress.com/2014/08/08/using-carousal-to-display-image-slide-from-database-in-asp-net/

旋转木马不在asp.net的bootstrap模式内工作

2 个答案: