search

iurygdeoliveira / Web-development-classes

Repository aimed at building collaborative knowledge about web development, especially with the computer science students at Campus Araguaína - IFTO. However, anyone can contribute if they wish to do so.
4 stars 41 forks source link

18º Desafio: Carregamento Desfocado - Peso 1 #23

Closed iurygdeoliveira closed 1 year ago

iurygdeoliveira commented 1 year ago

Contact Details

iury.oliveira@ifto.edu.br

Challenge Description

Bem-vindos, crianças inocentes! O desafio que trago para vocês hoje é um tanto quanto... embaçado! A tarefa é criar um carregamento desfocado, que irá impressionar e deixar qualquer usuário de queixo caído!

Para cumprir essa missão, vocês precisarão utilizar HTML, CSS e JavaScript para criar uma animação de carregamento que comece com um fundo embaçado e vá se tornando mais nítido à medida que o carregamento é concluído. Nada de usar frameworks prontos, aqui a ideia é colocar a mão na massa e criar algo único e original!

Para começar, vocês podem utilizar filtros CSS, como o blur(), para embaçar o fundo. Depois, utilizando JavaScript, vocês podem definir um temporizador para controlar a animação e ir reduzindo gradualmente o valor do filtro até que ele seja completamente removido.

Lembrem-se de caprichar nos detalhes, como a escolha das cores e das fontes utilizadas. Utilizem a criatividade e surpreendam a todos com a beleza e fluidez do carregamento desfocado que vocês irão criar!

Boa sorte e divirtam-se!

Exemplo

https://user-images.githubusercontent.com/30157522/223716567-9ef0a51d-8d52-41dd-9286-9ad1874c894d.mp4

Additional tips

Não hesitem em perguntar em caso de dúvida.

AndreAmario commented 1 year ago

Desafio.zip

Grupo: The_Makers

iurygdeoliveira commented 1 year ago

Desafio.zip

Grupo: The_Makers

resposta aceita