1

Eu fiz uma listagem em que inicialmente surgem 6 elementos e quando se clica num botão aparecem mais 4. A base de dados apenas tem 10 elementos. o código é:

<div class="row">
                <?php
            $query=mysqli_query($db,"select id_album, nome, foto from albuns order by id_album ASC limit 6");
             while($cat=mysqli_fetch_assoc($query)){?>
                    <div class="col-md-6">
                        <div class="portfolio-item">
                        <p class="imgDescription"> <?php echo $cat['nome'];?> </p>
                            <a>
                                <img class="img-portfolio img-responsive" src="<?php echo $cat['foto'];?>" onClick="location.href='listagem_album.php?id=<?php echo $cat['id_album'];?>'">
                            </a>
                        </div>
                    </div>
                    <?php } ?>

             <?php
            $query=mysqli_query($db,"select id_album, nome, foto from albuns order by id_album DESC limit 4");
             while($cat=mysqli_fetch_assoc($query)){?>
                    <div class="col-md-6" id="fotos" style="display:none">
                        <div class="portfolio-item">
                        <p class="imgDescription"> <?php echo $cat['nome'];?> </p>
                            <a>
                                <img class="img-portfolio img-responsive" src="<?php echo $cat['foto'];?>" onClick="location.href='listagem_album.php?id=<?php echo $cat['id_album'];?>'">
                            </a>
                        </div>
                    </div>
                   <?php } ?>
                </div>
                <div id="button"><a class="btn btn-dark">View More Categories</a></div>

o código js do botão é o seguinte:

 <script>
$("button").click(function(){
                $("#fotos").fadeIn(); });
</script>

A seguir apresento uma imagem da listagem:

inserir a descrição da imagem aqui

Mas quando eu clico no botão "show more categories" apenas aparece um elemento. Obrigada.

0

1 Resposta 1

1

Deve ser porque assim, voce está criando várias div's com a mesma id="fotos" dentro do seu loop, tenta fazer assim ó:

     $query=mysqli_query($db,"select id_album, nome, foto from albuns order by id_album DESC limit 4");
     <div class="col-md-6" id="fotos" style="display:none">
         while($cat=mysqli_fetch_assoc($query)){?>
           <div class="portfolio-item">
              <p class="imgDescription"> <?php echo $cat['nome'];?> </p>
              <a><img class="img-portfolio img-responsive" src="<?php echo $cat['foto'];?>" onClick="location.href='listagem_album.php?id=<?php echo $cat['id_album'];?>'"></a>
           </div>
         <?php } ?>
         <div id="button"><a class="btn btn-dark">View More Categories</a></div>
      </div>

dai, assim, vai criar uma só div com o id="fotos" e o loop monta varias div's com os itens dentro dela.
não testei, mas acredito que seja isso.

Espero que ajude

saúde e paz!

2
  • Boas @Armando , funcionou! Antes do while criei uma div sem class, apenas com o id="fotos". E depois do while mantive a div class="col-md-6" por questões de css. Obrigada
    – Claudia
    Commented 5/05/2016 às 13:01
  • Opa Claudia, mas vc pode criar com class tbn não vai afetar em nada para o jquery porque vc está usando o "ID" da div, mas vai afetar em tudo no seu layout com o bootstrap. Commented 5/05/2016 às 14:02

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .