23 de fevereiro de 2014
No tutorial anterior sobre Paginação PHP aprendemos de uma forma bem simplificada a criação de um script de paginação. Vamos agora estender um pouco mais nosso código e incluir a opção dos botões anterior e próximo para tornar a navegação mais dinâmica.
Utilize o mesmo código e altere a parte do código abaixo do comentário: //exibe a paginação por esse:
//exibe a paginação
if($pagina > 1) {
echo "<a href='index.php?pagina=".($pagina - 1)."' class='controle'>« anterior</a>";
}
for($i = 1; $i < $numPaginas + 1; $i++) {
$ativo = ($i == $pagina) ? 'numativo' : '';
echo "<a href='index.php?pagina=".$i."' class='numero ".$ativo."'> ".$i." </a>";
}
if($pagina < $numPaginas) {
echo "<a href='index.php?pagina=".($pagina + 1)."' class='controle'>proximo »</a>";
}
Note que temos agora dois condicionais IF, um no começo que verifica se a página atual é maior que 1 e outro no final que verifica se a página atual é menor que o número de páginas.
Também incluímos uma nova variável chamada $ativo que verifica qual a página ativa no momento e insere uma classe para podermos estilizar o CSS e destacar a página atual. E já que estamos fazendo esta inclusão de classe, segue um código pronto para ser inserido como estilo da página:
<style>
.numero{
text-decoration: none;
background: #2A85B6;
text-align: center;
padding: 3px 0;
display: block;
margin: 0 2px;
float: left;
width: 20px;
color: #fff;
}
.numero:hover, .numativo, .controle:hover{
background: #1B3B54;
}
.controle{
text-decoration: none;
background: #2A85B6;
text-align: center;
padding: 3px 8px;
display: block;
margin: 0 3px;
float: left;
color: #fff;
}
</style>
Espero que seja útil pra você.
Um abraço e até o próximo tutorial.
Visualizações: 17.880