首页 > 解决方案 > 显示空白页的动态引导轮播

问题描述

我正在使用 PHP 制作动态引导轮播。我正在观看并制作它:Dynamic BootStrap Carousel

但是我被困在一个没有错误的空白页面,检查元素上没有源代码的地方!我的代码与上面给出的实际链接代码有点不同。这是我的代码:

<?php
require 'php/dbh.inc.php'; //Database Connection File

$select= 'SELECT*FROM projects;';
$result= mysqli_query($conn, $select);
$count=mysqli_num_rows($result);


if($count<1){
echo "No rows found!";
}
else{
  while($row=mysqli_fetch_array($result)){
    $rows[]=$row;  //Mostly this section is the problem
  }
  return $rows;
}
?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Home</title>
    <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300&display=swap" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>
  <script src="js/main.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
<script >
    $(function(){
                $("#includedContent").load("include.html");
            });
</script>
</head>
<body>
<div id="includedContent"></div>

<div id="home">
    <div id="carouselExampleFade" class="carousel slide carousel-fade" data-ride="carousel">
        <ol class="carousel-indicators">
    <li data-target="#carouselExampleFade" data-slide-to="0" class="active"></li>
    <li data-target="#carouselExampleFade" data-slide-to="1"></li>
    <li data-target="#carouselExampleFade" data-slide-to="2"></li>
    <li data-target="#carouselExampleFade" data-slide-to="3"></li>
    <li data-target="#carouselExampleFade" data-slide-to="4"></li> 
  </ol>
  <div class="carousel-inner">
    <div class="carousel-item active">
      <img src="Images/Menu/1.jpg" class="d-block w-100" alt="...">
        <div class="carousel-content">
            <h3>First Slide</h3>
        </div>
    </div>
    <div class="carousel-item">
      <img src="Images/Menu/2.jpg" class="d-block w-100" alt="...">
      <div class="carousel-content">
            <h3>First Slide</h3>
        </div>
    </div>
    <div class="carousel-item">
      <img src="Images/Menu/3.jpg" class="d-block w-100" alt="...">
      <div class="carousel-content">
            <h3>First Slide</h3>
        </div>
    </div>
  <div class="carousel-item">
      <img src="Images/Menu/4.jpg" class="d-block w-100" alt="...">
      <div class="carousel-content">
            <h3>First Slide</h3>
        </div>
    </div>
  <div class="carousel-item">
      <img src="Images/Menu/5.jpg" class="d-block w-100" alt="...">
      <div class="carousel-content">
            <h3>First Slide</h3>
        </div>
    </div>
  </div>
  <a class="carousel-control-prev" href="#carouselExampleFade" 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="#carouselExampleFade" role="button" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>
</div>
  
<div id="about">
  <h1 class="about-head">About Me</h1>
  <div class="container">
  <div class="row" id="textimg">
<div class="col-md-6 col-sm-12">
 <img src="Images/sample.png" class="img-fluid"> 
</div>
<div class="col-md-6 col-sm-12">
  <p>
My name is Kabir Jhangiani, I am an aspiring photojournalist. I reside in this busy city Mumbai, where observing people, their events & capturing the most of it those daily lives became my favourite past time. I want to speak a story through a picture that not only shows what it shows but also speaks out my mind. It’s very interesting to observe people, their activities & what’s happening in their surroundings. My interest towards Street photography started getting more intense when I started covering events & cultures from Ganesh Festival to Muharram.
I would like to capture all of these moments on my camera to speak your style of story through my words. Painters express their art through paint, writers through words, I would like to capture the moments through emotions in them.
I am very fond of documenting different festivals, it talks about the history of the festival and the reasons behind it to celebrate.
Photography to me is, creating history, when we live in the future, we can live in the moment while looking at its visuals. 
  </p>
</div>
</div>
</div>
</div>
<div id="work">
  <h1 class="work-head">Work</h1>
  <div class="container">
    <div id="workCarousel" class="carousel slide carousel-fade" data-ride="carousel">
    <ol class="carousel-indicators">
      <?php
      $i=0;
      if(count($rows)){
        foreach ($rows as $value) {
          if($i==0){
            echo '<li data-target="#workCarousel" data-slide-to="0" class="active"></li>';
            $i++;
          }else{
            echo '<li data-target="#workCarousel" data-slide-to="0"></li>';
            $i++;
          }
        }
      }
      ?>
  </ol>
  <div class="carousel-inner">
    <?php
      $a=0;
      if(count($rows)){
        foreach ($rows as $value) {
          if($a==0){
            echo '<div class="carousel-item active">
                    <img src="Images/Projects/'.$value["ImageName"].'" class="d-block w-100" alt="...">
                  </div>';
            $a++;
          }else{
            echo ' <div class="carousel-item">
                    <img src="Images/Projects/'.$value["ImageName"].'" class="d-block w-100" alt="...">
                  </div>';
            $a++;
          }
        }
      }
      ?>
   
    <div class="carousel-item">
      <img src="" class="d-block w-100" alt="...">
    </div>
  <div class="carousel-item">
      <img src="" class="d-block w-100" alt="...">
    </div>
  <div class="carousel-item">
      <img src="" class="d-block w-100" alt="...">
    </div>
  </div>
   <a class="carousel-control-prev" href="#workCarousel" 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="#workCarousel" role="button" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>
</div>
</div>
</body>
</html>

在我看来,问题主要出在 while 循环部分或需要行,因为当我评论该部分时,我的内容就会显示出来。请帮忙!

标签: phphtmldynamicbootstrap-4carousel

解决方案


推荐阅读