Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/pamyszz/strangerthings
📺 Recriação da icônica sequência de título de "Stranger Things" com animações dinâmicas e áudio sincronizado usando JavaScript, HTML e CSS.
https://github.com/pamyszz/strangerthings
animation animation-css audio css css3 html html5 javascript modernizr stranger-things strangerthings
Last synced: 9 days ago
JSON representation
📺 Recriação da icônica sequência de título de "Stranger Things" com animações dinâmicas e áudio sincronizado usando JavaScript, HTML e CSS.
- Host: GitHub
- URL: https://github.com/pamyszz/strangerthings
- Owner: pamyszz
- License: mit
- Created: 2024-06-14T12:43:11.000Z (5 months ago)
- Default Branch: main
- Last Pushed: 2024-06-14T14:17:27.000Z (5 months ago)
- Last Synced: 2024-06-15T15:05:47.724Z (5 months ago)
- Topics: animation, animation-css, audio, css, css3, html, html5, javascript, modernizr, stranger-things, strangerthings
- Language: CSS
- Homepage: https://strangerthings-sigma.vercel.app
- Size: 1.12 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# **💾 Stranger Things - Intro**
_Este projeto é uma recriação da icônica sequência de título de "Stranger Things" usando JavaScript, HTML e CSS._
## 📺 Introdução
A introdução inclui animações e transições de texto dinâmicas, sincronizadas com uma faixa de áudio. O projeto utiliza verificações do Modernizr para garantir a compatibilidade com recursos essenciais e fornece alternativas para navegadores não suportados.
---
## 🎛️ Recursos
- **Texto Dinâmico**: Os elementos de texto são animados dinamicamente, criando o efeito característico do título de "Stranger Things".
- **Integração de Áudio**: A introdução reproduz uma faixa de áudio ("StrangerThings.mp3") sincronizada com a animação para uma experiência imersiva.
- **Verificações de Compatibilidade**: As verificações do Modernizr garantem a compatibilidade com recursos essenciais, como áudio, animações CSS e sombra de texto, fornecendo alternativas para navegadores não suportados.
---
## 📋 Uso
**Link**: Abra no Google Chrome para uma melhor experiência: [Stranger Things Intro](https://strangerthings-sigma.vercel.app/)
**No código - Implementação**
1. Clone o repositório.
```sh
git clone https://github.com/pamyszz/strangerthings.git
```
2. Abra `index.html` em um navegador moderno, de preferência Google Chrome, para a melhor experiência.
3. Certifique-se de que seu navegador suporta áudio, animações CSS e sombra de texto para o efeito completo.
---
## 🎨 Personalização
Sinta-se à vontade para personalizar o texto, as cores e outros elementos visuais modificando os arquivos HTML e CSS. Adicione sua própria faixa de áudio para personalizar a experiência.
---
## 💡 Agradecimentos
- O projeto é inspirado na sequência de título de "Stranger Things".
- Faixa de áudio: "StrangerThings.mp3".
---
## 🛠️ Ferramentas Utilizadas
- **HTML**: Estrutura da página.
- **CSS**: Estilização e animações.
- **JavaScript**: Controle das animações e sincronização de áudio.
- **Modernizr**: Verificações de compatibilidade.
---
## 🧇 Contribuições
Contribuições são bem-vindas! Siga os passos abaixo para contribuir:
1. Fork o projeto.
2. Crie uma branch com a sua feature (`git checkout -b feature/AmazingFeature`).
3. Faça commit das suas alterações (`git commit -m 'Add some AmazingFeature'`).
4. Faça push para a branch (`git push origin feature/AmazingFeature`).
5. Abra um Pull Request.
---
**Divirta-se recriando a magia de Stranger Things!**