Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa Noite pessoal,
Eu tenho uma pequena duvida: Eu consigo fazer meu codigo verificar a resolução da tela do usuario mas como faço para exibir uma imagem diferente para cada resolução?
Codigo exemplo:
if (screen.width==800)
<img src="pictures/fundo4.jpg" width="100%" height="500px" />
else if (screen.width==1024)
<img src="pictures/fundo5.jpg" width="100%" height="500px" />--------------------
Mas a imagem não aparece, como seria o codigo para que a imagem aparecesse.
Abraços e agradeço desde já
Opa obrigado por responder, e como seria esse codigo? pra salvar a variavel, porque esse que tenho sei que funciona pra verificar a tela, porque soltei um alert só pra confirmar e funcionou, mas quando tentei usar o <img src> ao inves do alert, ele não funciona.
Teria como me ajudar?
Dá uma olhada aqui, Perfect Full Page Background Image (inglês).
Quanto ao script, tenta assim:
<script type="text/javascript">
function trocarClasse() {
var obj = document.getElementById("bgbody");
if (screen.width == "800"){
obj.className = 800;
}
else if (screen.width == "1024"){
obj.className = 1024;
}
else if (screen.width == "1280" ){
obj.className = 1280;
}
else if (screen.width == "1440"){
obj.className = 1440;
}
else if (screen.width == "1600"){
obj.className = 1600;
}
else {
obj.className = outra;
}
}
</script>No body, coloque:
<body id="bgbody" class="resolucao" onload="trocarClasse ()">
Dai é só criar os css à sua preferência:
#bgbody.1600 {
background:url(page_bg1600.jpg);
}#bgbody.1440 {
background:url(page_bg1440.jpg);
}*PS: Solução original do usuário **Turdin** do fórum JoomlaClube.*
Post: Background de acordo com a resolução da tela.
Apenas achei relevante ao assunto deste tópico. Se for de encontro alguma regra, favor deletar.
Valeu kra, eu modifiquei um pouco oque eu queria e esse codigo de background me ajudou bastante.
Faz um código que verifique a resolução da tela do usuário. -- ok
Salva a largura da tela em uma variável.
Ai, você faz o if else.