Foreach 循环中的 Bootstrap 轮播

Question

我有带有 4 张图像的轮播，如下图所示。

我的努力如下。

<div id="thumbCarousel" class="carousel slide">
    <div class="carousel-inner">
        <?php $i=0; foreach($this->partner_images as $sr){?>
             <?php if($i==0){ ?><div class="item active"><?php } ?>
                 <?php if($i ==4){ ?><div class="item"><?php }?>
                      <div class="col-xs-3">
                            <a href="<?php echo $sr['url']; ?>">
   <img src="<?php echo BASE_URL?>/partner-images/<?php echo $sr['name']?>" />
                            </a>
                      </div>
                            <?php if($i==3 or $i==7){ ?></div><?php }?>
                          <?php $i++; } ?>
                     </div>
                    <a class="thumbleft" href="#thumbCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
                    <a class="thumbright" href="#thumbCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span> </a>
    </div>
</div>

问题：

问题是它对于 4 个图像和 8 个图像工作正常，因此当有 4 个或更多图像时无法正常显示。我想自动执行此操作，无论图像是偶数还是奇数。

问题： 我的问题是如何自动显示 4 个或更多图像（如图像中所示）？

Answer 1

我尝试了一下，效果很好。

<div id="thumbCarousel" class="carousel slide">
  <div class="carousel-inner">
    <?php $i=0; foreach($this->partner_images as $sr){?>
         <?php if($i==0){ ?><div class="item active"><?php } ?>
             <?php if($i % 2 == 0){ ?><div class="item"><?php }?>
                  <div class="col-xs-3">
                        <a href="<?php echo $sr['url']; ?>">
       <img src="<?php echo BASE_URL?>/partner-images/<?php echo $sr['name']?>" />
                        </a>
                  </div>
                        <?php if($i % 4 != 0){ ?></div><?php }?>
                      <?php $i++; } ?>
                 </div>
                <a class="thumbleft" href="#thumbCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
                <a class="thumbright" href="#thumbCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span> </a>
     </div>
</div>