选择前10行并显示为幻灯片

bqf10yzr  于 2021-06-17  发布在  Mysql
关注(0)|答案(1)|浏览(350)

我正在创建一个网站,我想把我的数据显示成幻灯片从数据库。幻灯片是使用引导程序制作的。
我的代码如下所示:

<?php
include 'header.php';
require 'includes/dbh-inc.php';

function make_query($conn)
{
    $query = " SELECT * FROM notes ORDER BY id ASC";
    $result = mysqli_query($conn,$query);
    return $result;
}

function make_slide_indicators($conn)
{
    $output = '';
    $count = 0;
    $result = make_query($conn);
    while($row = mysqli_fetch_array($result))
    {
        if($count == 0)
        {
            $output .= '<li data-target="#dynamic_slide_show" data-slide-to="'.$count.'" class="active"></li>
            ';
        } else {
            $output .= '<li data-target="#dynamic_slide_show" data-slide-to="'.$count.'"></li>';
        }
        $count = $count + 1 ;
    }
    return $output;
}

function make_slides($conn)
{
    $output = '';
    $count = 0;
    $result = make_query($conn);
    while($row = mysqli_fetch_array($result))
    {
        if($count == 0)
        {
            $output .= '<div class="item active">';
        } else {
            $output .= '<div class="item">';
        }
        $output .= '<img src="images/notes/'.$row["image"]
                .'" alt="'.$row["denomination"].'" style=" width: 100%;height: 300px;" /> 
                <div class="carousel-caption"> 
                <h3>' .$row['price'].'</h3>
                </div>';
        $count = $count +1;
    }
    return $output;
}
?>

<main> 
    <div class="container">
        <h2 align="center">Pedigree Notes</h2>
        <br />
        <div id="dynamic_slide_show" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators">
            <?php echo make_slide_indicators($conn); ?>
            </ol>

            <div class="carousel-inner">
                <?php echo make_slides($conn); ?>
            </div>
            <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>

        </div>
    </div>
</main>

<?php
include 'footer.php';
?>

它以某种方式工作,但它在第一张幻灯片中显示数据库中的两张图片,第一张幻灯片的一半显示第一张图片,另一半显示第二张图片。
你能告诉我该怎么做吗?

q5iwbnjs

q5iwbnjs1#

在函数make\u slides中,将类项更改为carousel项

if($count == 0)
{
   $output .= '<div class="carousel-item active">';
} else {
        $output .= '<div class="carousel-item">';
}

相关问题