Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal, sou um membro novo aqui no iMasters e estou tendo um probleminha com um código em JavaScript, não tenho pressa para resolução do caso, mas gostaria de obter minha resposta, pois sei que o pessoal do iMasters é fera! :D
Eis o código que eu encontrei, ele faz perfeitamente o que eu quero que faça, mas ao invés de mostrar um "window.alert" eu gostaria que ele alterasse o Background do site:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Meu site</title>
</head>
<script language="JavaScript" type="text/javascript">
var horario = new Date();
var hora = horario.getHours();
var exibe = "Boa noite";exibe = "Boa tarde";
}
window.alert(exibe);
</script>
<body>
</body>
</html>Creio que para fazer essa alteração eu precisaria de um CSS se comunicando com o JavaScript mas sou muito leigo em JavaScript. Bom, as imagens seriam apenas "dia.jpg" para quando horário estaria entre as 6:00 e as 18:00 e "noite.jpg" para quando o horário estaria entre 19:00 e as 4:00. Alguém tem a resposta do meu problema? Desde já agradeço!
cara poderia postar o seu resultado para eu conferir para ver se bate com o meu resultado?
>
cara poderia postar o seu resultado para eu conferir para ver se bate com o meu resultado?
Ficaria assim:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Meu site</title>
</head><script language="JavaScript" type="text/javascript">
var horario = new Date();
var hora = horario.getHours();
var exibe = '<link rel="stylesheet" href="css/noite.css" />';exibe = '<link rel="stylesheet" href="css/tarde.css" />';
}
document.write(exibe);
</script>
<body></body>
</html>
Ele estaria escrevendo no documento o código do **<link>** que seria interpretado pelo HTML e retornaria o CSS alterando o fundo e cores, por exemplo. E desculpa a demora de mais de 1 ano para responder, mas estava parado um pouco nos foruns que participo. Obrigado por enviar a MP pedindo para postar a resolução. :grin:Veja esta modificação:
<!-- iMasters Fóruns -- Alterar fundo dia e noite - Spoock || Modificado: WeJr -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Meu site</title>
</head>
<body>
Conteúdo da pagina.
<script language="JavaScript" type="text/javascript">
var horario = new Date();
var hora = horario.getHours();
var cor = 'rgb(111, 111, 111)';
if ((hora >= 6) && (hora < 12)) {
cor = 'rgb(243, 241, 189)';
} else if ((hora >= 12) && (hora < 19)) {
cor = 'rgb(250, 238, 147)';
}
document.body.style.backgroundColor=cor;
</script>
</body>
</html>Realiza o mesmo trabalho, mas com a vantagem de não transferir um arquivo do servidor.
Se for necessário muitas alterações no estilo do site, seu código seria uma opção, mas poderia ser utilizado PHP.
Em PHP ficaria assim:
<!-- iMasters Fóruns -- Alterar fundo dia e noite PHP - WeJr || Original (JavaScript) Spoock -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Site</title>
<style>
<?php
date_default_timezone_set("America/Sao_Paulo"); //Lista em: http://www.php.net/manual/pt_BR/timezones.php
$hora = date("G");
if ($hora >= 6 && $hora < 12) echo "body{background-color:rgb(243, 241, 189);}"; //Dia
elseif ($hora >= 12 && $hora < 19) echo "body{background-color:rgb(250, 238, 147);}"; //Tarde
else echo "body{background-color:rgb(111, 111, 111);}"; //Noite
?>
</style>
</head>
<body>
Conteúdo da pagina.
</body>
</html>
Galera, eu consegui, simplismente inserí esse codigo que postei, ao invés de chamar um window.alert coloquei para chamar um document.write em cada horário, e em cada horario coloquei um <link> para o css dia, manha e noite. Foi simples, mas é uma verdadeira gambiarra. Por mim o moderador pode fechar o tópico, problema resolvido! :clap: