Background-image Dinamico

Compartilhe a ajude a divulgar o blog:

Recurso simples e muito útil, a idéia é que a cada atualização de página o BG seja diferente,

primeiro vamos criar as classes que armazenam as imagens no CSS:

.bg1 { background-image: url(img1.jpg);}
.bg2 { background-image: url(img2.jpg);}
.bg3 { background-image: url(img3.jpg);}

agora vamos criar um array no PHP pra poder armazenar os itens, e selecionar aleatoriamente com o “RAND”:

<?php
$bgArray = Array("bg1", "bg2", "bg3");
$cssClass = $bgArray[rand(0 , count($bgArray) - 1)];
?>

agora pra finalizar vamos imprimir o valor armazenado variavel $cssClass no HTML com o seguinte codigo:

<body class="<?php echo $cssClass; ?>">

Leia Também:

Sobre Tilo

Profissional FrontEnd desde 2006, Executa trabalhos com xHtml, CSS, JavaScript, MySQL e PHP, estudante de C# e SQL. Cursa Tec. em Analise e Desenvolvimento de Sistemas na UniItalo.
Esta entrada foi publicada em PHP e marcada com a tag . Adicione o link permanente aos seus favoritos.

5 respostas a Background-image Dinamico

  1. Marcelo disse:

    Estou tentando aplicar essa class mas em ASP. Vc teria alguma idéia?

  2. guati disse:

    Olá Tilo,

    existe a possibilidade de ter esse PHP externo para modificar o bg da página em HTML ou precisarei mesmo salvar minha página como PHP?

  3. Tilo disse:

    Bem, para a função funcionar ele precisar ser um .PHP mesmo!

  4. Thinmy disse:

    Na verdade pode ser utilizado qualquer linguagem de programação, basta incrementar como é em cada um delas..
    cria array com as classes e bgs diferentes como no primeiro exemplo, e puxa aleatoriamente.

  5. Kitchen Doors disse:

    Finest Blog site Content I’ve Ever before Experienced ;

Deixe um Comentário

O seu endereço de email não será publicado Campos obrigatórios são marcados *

*

Você pode usar estas tags e atributos de HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Spam Protection by WP-SpamFree