时间戳

首页 > 解决方案 > 动态滑动器只能在第一张幻灯片上显示和循环

javascript - 动态滑动器只能在第一张幻灯片上显示和循环

问题描述

动态滑块能够从数据库中获取所有数据，但只能在第一个滑块上显示所有数据。而不是随后在滑块中显示。抱歉这个愚蠢的问题，已经为此工作了数周，但似乎找不到任何解决方案。php中的while循环应该不是问题，但我可能错了。任何人都可以请赐教吗？

PHP

<?php
$connect = mysqli_connect("localhost", "root", "", "db");
$result = make_query($connect);

function fetch_array(&$array) {
    // Grab the first value from the array
    $return = current($array);
    // remove the value we just grabbed 
    array_shift($array);
    // if what we have is an array spit it out, else return false
    return is_array($return) ? $return : false;
}

function make_query($connect) { 
    $query = "SELECT * FROM db.slider ORDER BY p_id ASC";
    $result = mysqli_query($connect, $query);
    return $result;
}

function make_slides($result) {
    $output = '';
    $count = 0;
    
    
    while($row = mysqli_fetch_assoc($result)) {
   // while($row = fetch_array($result)) {
        // Not needed as the output is the same
        //if($count == 0) {
        $output .= '
    <div class="swiper-slide platform">
        <img src="'.$row["p_img"].'" alt="'.$row["p_name"].'" />
        <div class="swiper-slide platform">
            <h3>'.$row["p_desc"].'</h3>
        </div>
    </div>';
        // Not used at the moment
         $count++;
         
         
         //echo json_encode($row);
         echo $output;
        
        }
    
    
    return $output;
}

JS 扫地机

<script>
  var swiper = new Swiper('.swiper-container.platform', {
  effect: 'coverflow',
  initialSlide: 0-5,
  grabCursor: true,
  centeredSlides: true,
  slidesPerView: 'auto',
  coverflowEffect: {
    rotate: 0,
    stretch: 0,
    depth: 800,
    modifier: 1,
    slideShadows: true,
  },
  pagination: {
    el: '.swiper-pagination',
  }
});

</script>

标签： javascriptphpslider

解决方案

设法通过使用另一个滑块/滑动器解决了这个问题。

推荐阅读