0

I have Carousel with 4 images like given in the following image.

enter image description here

My Effort is given in following.

<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>

Problem:

The problem is that it is working fine for 4 images and for 8 images, so when there are 4 or more picture are not showing properly. I want to do it automatically either images are even or odd.

Question: My question is how i can show 4 or more images like shown in the images automatically ?

3
  • Why not use % (MOD)
    – Ali Zia
    Mar 18, 2016 at 12:04
  • @AliZia how i can use % please explain. Mar 18, 2016 at 12:08
  • Please check my answer.
    – Ali Zia
    Mar 18, 2016 at 12:10

1 Answer 1

5

I try this and it is working fine.

<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>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.