Ashish Aware
Ashish Aware

Reputation: 169

Multiple images from foreach loop in carousel doesn't work

This code is not working properly. It shows result in each single thumbnail instead of showing in single thumbnail and does not move.

<div id="myCarousel" class="carousel slide" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
    <li data-target="#myCarousel" data-slide-to="1"></li>
    <li data-target="#myCarousel" data-slide-to="2"></li>
    <li data-target="#myCarousel" data-slide-to="3"></li>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <div class="item active">                            
      <ul class="thumbnails">                           
        <li class="span2">
          <?php foreach ($oneimg->result() as $oneimg):?> 
          <div class="thumbnail">
            <img src="<?php echo HTTP_IMAGES_PATH_UPLOADIMAGE; ?><?php echo $oneimg->images ?>" 
                 alt=""  class="img-responsive" style="height:180px; width:100%"/>                                      
          </div>
          <?php  endforeach;   ?> 
        </li>                                     
      </ul>          
    </div>
  </div>

</div>

Upvotes: 1

Views: 2058

Answers (2)

Ashish Aware
Ashish Aware

Reputation: 169

thank you all for answer but i have solved it and it works perfect here is the solution

<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
  <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
  <li data-target="#myCarousel" data-slide-to="1"></li>
  <li data-target="#myCarousel" data-slide-to="2"></li>
  <li data-target="#myCarousel" data-slide-to="3"></li>
</ol>

<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">

   <?php $i = 1; ?>
        <?php foreach ($oneimg->result_array() as $oneimg): ?>
        <?php $item_class = ($i == 1) ? 'item active' : 'item'; ?>
            <div class="<?php echo $item_class; ?>">
                  <a href="#">
                            <img src="<?php echo HTTP_IMAGES_PATH_UPLOADIMAGE; ?><?php echo $oneimg['images']; ?>" 
                                alt=""  class="img-responsive" style="height:400px; width:100%" />
                  </a>
            </div>
        <?php $i++; ?>
    <?php endforeach; ?> 

</div>

<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
  <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
  <span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
  <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
  <span class="sr-only">Next</span>
</a>

Upvotes: 0

Abdulla Nilam
Abdulla Nilam

Reputation: 38584

<?php
    foreach ($oneimg as $oneimg_new)
    {
        ?>
        <div class="thumbnail">

            <img src="<?php echo HTTP_IMAGES_PATH_UPLOADIMAGE; ?><?php echo $oneimg_new['images']?>"
                 alt=""  class="img-responsive" style="height:180px; width:100%"/>

        </div>
    <?php
    }
?> 

Upvotes: 1

Related Questions