Introdução
- Introdução
- Por que usar?
- Como usar?
- Estrutura de arquivos e dinâmica do curso
Basics
- Método set()
- Método to()
- Método from()
- Método fromTo()
- Delay
- Easings
- Método staggerTo()
- Método staggerFrom()
- Método staggerFromTo()
- Cycle
- Loops
- Callbacks
Timelines
- Encadeando animações com a timeline
- Controlando ordem de animação com position parameter
- Métodos de controle da Timeline
- Mudando a velocidade com timeScale
Loaders
- Loader balls com stagger
- Loader square-ball
- Loader Circle (SVG)
- Loader draw lines (SVG)
- Ícones em SVG
Trabalhando com Polyart
- Animando um urso polar poligonal e criando um mini-joguinho de adivinhação
- Animando polígonos em direção randômicas
Animando um SVG com vários elementos
- Criando a estrutura do SVG e seletores
- Criando a animação crua
- Controlando a aceleração e tempo da animação
- Refatorando a animação
Criando um Modal com diferentes animações
- Criando a estrutura do modal
- Criando o efeito de Fade In
- Criando a função de fechar o modal
- Criando o efeito de Fade In Scale
- Criando o efeito de Slide in
- Criando o efeito de Fullscreen
- Limpando as propriedades com clearProps
Criando um Slider do zero
- Mostrando o slider final
- Criando a estrutura html
- Criando o CSS - parte 1
- Criando o CSS - parte 2
- Criando as setas de controle
- Iniciando a animação de entrada do slider
- Refatorando o código da animação
- Criando a animação de saída do slider
- Fazendo o controle das setas e detalhes finais
Aprendendo o Draggable
- Basics
- Bloqueando eixos de movimentação
- Definindo fronteiras para o drag
- Criando resistências
- Criando callbacks
- Criando um jogo para montar seu próprio homem cabeça de batata
- Criando um quebra-cabeça animado
- Criando um slider de preço
- Entendendo o hitBox movendo pastas
- Criando um slider de antes/depois
