Как динамически изменить изображение совы карусели из базы данных MySQL с информацией - PullRequest
0 голосов
/ 23 апреля 2020

Я искал в Интернете весь день сегодня и не смог найти никакого решения для добавления динамического c изображения в совую карусель из базы данных MySQL с информацией. Если кто-нибудь может помочь?

Я сделал что-то вроде следующего, но я получаю только один слайд, например bootstrap, он не показывает все изображения и информацию о таблицах из базы данных. Если я oop, это дает мне все таблицы на одной странице.

    <link rel="stylesheet" type="text/css" href="http://www.24limousine.com/wp-content/themes/24Limousine/assets/css/owl.carousel.min.css">
    <?php

    $connect = mysqli_connect("localhost", "root", "", "testing");
    function make_query($connect)
    {
    $query = "SELECT * FROM banner ORDER BY banner_id ASC";
    $result = mysqli_query($connect, $query);
    return $result;
    }

    function make_slide_indicators($connect)
    {
    $output = ''; 
    $count = 0;
    $result = make_query($connect);
    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;
    }

     return $output;
    }

    function make_slides($connect)
    {
    $output = '';
    $count = 0;
    $result = make_query($connect);
    while($row = mysqli_fetch_array($result))
    {
    if($count == 0)
    {
    $output .= '<div class="item active">';
    }
    else
    {
    $output .= '<div class="item">';
    }
    $output .= '
    <img src="banner/'.$row["banner_image"].'" alt="'.$row["banner_title"].'" />
    <div class="carousel-caption">
    <a href="faq.php" class="button-02"> <h3>'.$row["banner_title"].'</h3> </a>
    </div>
    </div>
    ';
    $count = $count + 2;
    }
    return $output;
    }

    ?>

    <div class="cover-wrapper">
    <div id="client-logos" class="owl-carousel text-center">


        <div class="item">
            <div class="client-inners">
             <?php echo make_slides($connect); ?>
            </div>
        </div> 

    </div>
    </div>


    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://www.24limousine.com/wp-content/themes/24Limousine/assets/js/owl.carousel.min.js"></script>
    <script>
    $(document).ready(function() {
    $('#client-logos').owlCarousel({
//        loop:true,
        margin:15,
        nav:true,
        responsive:{
            0:{
                items:2
            },
            600:{
                items:4
            },
            1000:{
                items:6
            }
        },
        navText: ["<img src='http://pixsector.com/cache/a8009c95/av8a49a4f81c3318dc69d.png'/>","<img src='http://pixsector.com/cache/81183b13/avcc910c4ee5888b858fe.png'/>"]
    });

...