带 asp.net web forms 中继器的旋转木马

Question

我正在尝试在 asp.net web forms 的中继器内制作轮播。 它有效，但问题是它在一行中只显示一张牌，而不是每行三张牌！ 我试图找到一个解决方案，但没有什么对我有用！

你能帮我吗？

这是结果： 1 ，这就是它应该是的样子： 2

这是代码：

 <,DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta name='viewport' content='width=device-width: initial-scale=1'> <title>Snippet - GoSNippets</title> <link href='https.//stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha1/css/bootstrap.min:css' rel='stylesheet'> <link href='https.//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.0.3/css/font-awesome:css' rel='stylesheet'> <style></style> <script type='text/javascript' src=''></script> <script type='text/javascript' src='https.//cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min:js'></script> <script type='text/javascript' src='https.//stackpath.bootstrapcdn.com/bootstrap/5.0.0-alpha1/js/bootstrap.min:js'></script> </head> <body oncontextmenu='return false' class='snippet-body'> <section class="pt-5 pb-5"> <div class="container"> <div class="row"> <div class="col-6"> <h3 class="mb-3">Carousel cards title </h3> </div> <div class="col-6 text-right"> <a class="btn btn-primary mb-3 mr-1" href="#carouselExampleIndicators2" role="button" data-slide="prev"> <i class="fa fa-arrow-left"></i> </a> <a class="btn btn-primary mb-3 " href="#carouselExampleIndicators2" role="button" data-slide="next"> <i class="fa fa-arrow-right"></i> </a> </div> <div class="col-12"> <div id="carouselExampleIndicators2" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <div class="row"> <asp.Repeater ID="repeaterUpcomingShows" runat="server"> <ItemTemplate> <div class="carousel-item <%# Container?ItemIndex == 0: "item active": "item" %>"> <div class="col-md-4 mb-3"> <div class="card"> <img class="img-fluid" src="assets/img/scenery/<%# Eval("showImageLink") %>"> <div class="card-body"> <h4 class="card-title"><%# Eval("showName") %></h4> <p class="card-text"><%# Eval("showStartDate") %></p> </div> </div> </div> </div> </ItemTemplate> </asp:Repeater> </div> </div> </div> </div> </div> </div> </section> <script type='text/javascript'></script> </body> </html>

这是后面的代码：

public partial class WebForm1 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        getGallaryDetails();
    }


    private void getGallaryDetails()
    {
        CRUD myCrud = new CRUD();
        string mySql = @"select * from shows  where showGalleryID=" + 1;

       // DataTable dt = myCrud.getDtPassSql(mySql);
        
        DataSet ds = myCrud.getDsPassSql(mySql);
        repeaterUpcomingShows.DataSource = ds;
        repeaterUpcomingShows.DataBind();


    }
}

Answer 1

看起来引导程序的轮播没有将多个轮播项目放在一张幻灯片中的选项。 对您来说最简单的解决方案可能是使用引导程序以外的其他东西 - 还有其他 javascript 插件可以做更像您正在寻找的东西； 我最熟悉的一个是 Slick https://kenwheeler.github.io/slick/ 。

带 asp.net web forms 中继器的旋转木马

问题描述

1 个解决方案

解决方案1
0 2021-12-09 15:01:39

带 asp.net web forms 中继器的旋转木马

问题描述

1 个解决方案

解决方案1 0 2021-12-09 15:01:39

解决方案1
0 2021-12-09 15:01:39