https://github.com/ninja1375/contagem-regressiva-para-natal
Contagem Regressiva para o Natal
https://github.com/ninja1375/contagem-regressiva-para-natal
css html javascript natal
Last synced: 3 months ago
JSON representation
Contagem Regressiva para o Natal
- Host: GitHub
- URL: https://github.com/ninja1375/contagem-regressiva-para-natal
- Owner: Ninja1375
- License: mit
- Created: 2024-12-14T00:30:43.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-12-14T19:57:03.000Z (6 months ago)
- Last Synced: 2024-12-22T09:46:02.248Z (5 months ago)
- Topics: css, html, javascript, natal
- Language: CSS
- Homepage: https://ninja1375.github.io/Contagem-regressiva-para-natal/
- Size: 25.4 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# Contagem Regressiva para o Natal
Este projeto é uma contagem regressiva visual e animada para o Natal, utilizando HTML, CSS e JavaScript. A interface exibe os dias, horas, minutos e segundos restantes até o Natal de 2024.
## Demonstração
**[Contagem Regressiva para o Natal](https://ninja1375.github.io/Contagem-regressiva-para-natal/)**
## Tecnologias Utilizadas
- **HTML**: Estrutura do layout.
- **CSS**: Estilização e animações.
- **JavaScript**: Lógica de cálculo do tempo restante.
## Como Usar
1. Faça o download dos arquivos do projeto: `index.html`, `style.css` e `script.js`.
2. Certifique-se de que os três arquivos estão na mesma pasta.
3. Abra o arquivo `index.html` em um navegador para visualizar a contagem regressiva.
## Estrutura do Projeto
- **index.html**:
- Estrutura principal com elementos de contagem e texto introdutório.
- Inclui referência aos arquivos CSS e JavaScript.
- **style.css**:
- Estiliza os círculos e o texto exibido na contagem.
- Define animações de "bounce" para os elementos.
- **script.js**:
- Calcula a diferença de tempo entre a data atual e o Natal de 2024.
- Atualiza os elementos da contagem em tempo real.
## Pré-visualização
A interface apresenta quatro círculos coloridos, cada um mostrando:
- Dias restantes.
- Horas restantes.
- Minutos restantes.
- Segundos restantes.
Além disso, há uma mensagem de "Feliz Natal!" e um botão fictício para "Compre Agora".
## Personalização
- Para alterar a data da contagem regressiva, modifique a seguinte linha no arquivo `script.js`:
```javascript
var dest = new Date("dec 25, 2024 12:00:00").getTime();
Substitua "dec 25, 2024 12:00:00" pela data desejada.
## 📄 Licença
[](https://github.com/Ninja1375/Contagem-regressiva-para-natal/blob/main/LICENSE)
## Apoie-me:
