Imagens aleatórias no background-image do css
10/07/2017
0
Fala galera, beleza?
Queria saber se tem algum jeito de carregar uma imagem de maneira aleatória na propriedade background-image no css.
Tenho uma pasta com 10 imagens e tenho uma página que precisaria carregar qualquer uma dessas 10 imagens numa determinada div.
Alguém tem ideia de como faço isso?
Queria saber se tem algum jeito de carregar uma imagem de maneira aleatória na propriedade background-image no css.
Tenho uma pasta com 10 imagens e tenho uma página que precisaria carregar qualquer uma dessas 10 imagens numa determinada div.
Alguém tem ideia de como faço isso?
Bernardo Barbosa
Curtir tópico
+ 0
Responder
Post mais votado
10/07/2017
Bom dia Bernardo, tudo certo ? Espero que sim
Olha so esse site: http://ericaepedrofaccio.com.br/novo/
Perceba que a cada inicialização do site, aparece um banner diferente !
Fiz isso com PHP, fazendo uma consulta aleatoria no banco. A consulta ficou mais ou menos assim: "SELECT * FROM banners ORDER BY RAND() LIMIT 1"
Com isso eu salvo numa variavel, e uso ela no meu front-end. Sempre que a pessoa atualizar o site aparece um banner novo. As vezes por nao ter uma quantidade muito grande de registros, a consulta pode te retornar o mesmo banner rsrs mas isso e dificil.
Espero que você tenha entendido.
Forte abraço !
Olha so esse site: http://ericaepedrofaccio.com.br/novo/
Perceba que a cada inicialização do site, aparece um banner diferente !
Fiz isso com PHP, fazendo uma consulta aleatoria no banco. A consulta ficou mais ou menos assim: "SELECT * FROM banners ORDER BY RAND() LIMIT 1"
Com isso eu salvo numa variavel, e uso ela no meu front-end. Sempre que a pessoa atualizar o site aparece um banner novo. As vezes por nao ter uma quantidade muito grande de registros, a consulta pode te retornar o mesmo banner rsrs mas isso e dificil.
Espero que você tenha entendido.
Forte abraço !
Arnold Santos
Responder
Mais Posts
11/07/2017
Calebe Menezes
Fala Bernardo, beleza?
Então cara, a forma apresentada pelo Arnold é uma das maneiras que você pode fazer. Se estiver usando o PHP pode utilizar o jeito que ele indicou. Mas se quiser fazer essa alteração no front-end você pode utilizar o JavaScript/Jquery para mudar as imagens de maneira aleatória.
Tenho quase certeza que que só com CSS isso não é possível,
Espero ter ajudado :)
Então cara, a forma apresentada pelo Arnold é uma das maneiras que você pode fazer. Se estiver usando o PHP pode utilizar o jeito que ele indicou. Mas se quiser fazer essa alteração no front-end você pode utilizar o JavaScript/Jquery para mudar as imagens de maneira aleatória.
Tenho quase certeza que que só com CSS isso não é possível,
Espero ter ajudado :)
Responder
19/07/2017
Bernardo Barbosa
Arnold e Calebe, obrigado pela resposta!
Tive que usar Jquery para resolver essa situação. Quebrei a cabeça tentando com css mas não consegui, mesmo pesquisando bastante.
Obrigado a todos!
Tive que usar Jquery para resolver essa situação. Quebrei a cabeça tentando com css mas não consegui, mesmo pesquisando bastante.
Obrigado a todos!
Responder
Clique aqui para fazer login e interagir na Comunidade :)
