Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

renan.miranda

Carousel dinâmico Bootstrap 3 - class="item active"

Recommended Posts

Saudações meus amigos...

 

Vamos lá...

 

Eu estou implantando um Slideshow do Bootstrap em meu site, acessando os dados dinâmicos de um banco, usando um foreach, bem... maravilha... mas tem um porém, na sintaxe do Carousel, ele pede pra que a primeira imagem tenha a class="item active", e como se trata de um foreach, como eu posso fazer com que eu diga que a primeira imagem deva ter essa classe, e as demais não?

 

Abaixo a sintaxe, sem a consulta no banco... apenas o HTML:

<div class="carousel-inner" role="listbox">                   
  
  <div class="item active">
    <img src="6.jpg" alt="imagem">
    <div class="carousel-caption">
     <h3>Chania</h3>
     <p>The atmosphere in Chania has a touch of Florence and Venice.</p>
    </div>
  </div>

  <div class="item">
    <img src="4.jpg" alt="Chania">
    <div class="carousel-caption">
     <h3>Chania</h3>
     <p>The atmosphere in Chania has a touch of Florence and Venice.</p>
    </div>
  </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">Anterior</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">Próxima</span>
   </a>

</div>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Faça o controle pelo índice array

 

Se a var $key for == a 0

 

da echo na class active

<?php foreach ($variable as $key => $value): ?>    


 <div class="item <?php if ($key <=0) { echo 'active' } ?>">
    <img src="6.jpg" alt="imagem">
    <div class="carousel-caption">
     <h3>Chania</h3>
     <p>The atmosphere in Chania has a touch of Florence and Venice.</p>
    </div>
  </div>

<?php endforeach ?>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.