Um projeto web simples e dinâmico que muda a cor de fundo e a imagem exibida de acordo com a hora do dia.
Este projeto demonstra como usar JavaScript para criar um site interativo que reage ao tempo real. Ao carregar a página, o site exibirá uma mensagem com a hora atual, uma imagem correspondente ao período do dia (manhã, tarde ou noite) e alterará a cor de fundo de acordo.
O design foi pensado para ser responsivo, adaptando-se a diferentes tamanhos de tela, desde smartphones até PCs, utilizando Media Queries em CSS.
Este projeto foi construído utilizando:
- HTML: Para a estrutura da página.
- CSS: Para o estilo visual, incluindo responsividade (via Media Queries) e o formato circular da imagem.
- JavaScript: Para a lógica dinâmica de detecção da hora e alteração do conteúdo e estilo.
Basta abrir o arquivo index.html no seu navegador web para ver o projeto em ação.
- Exibe a hora atual na tela.
- Muda a imagem principal para refletir a manhã, tarde ou noite.
- Altera a cor de fundo da página de acordo com o período do dia.
- Apresenta uma saudação personalizada ("Bom dia!", "Boa tarde!", "Boa noite!").
- Design responsivo, garantindo uma boa experiência em diversos dispositivos através do uso de Media Queries.
- HTML
- CSS
- JavaScript
Pronto por hora mas caso apareça uma nova ideia, irei implementar.
Olá! Sou um estudante de Ciências da Computação em constante aprendizado. Este projeto, "Horacolor", faz parte da minha jornada de desenvolvimento web e exploração das tecnologias front-end.
Sinta-se à vontade para explorar o código e fornecer feedback!
Criado por Piter Gomes.