Skip to main content

Perguntas com a tag [keyframes]

A tag não tem possui recomendações de uso.

Filtrar por
Ordenado por
Com tags
4 votos
2 respostas
807 visitas

Como animar um Radial-Gradient ou Linear Gradiente com CSS?

Estou tentando fazer uma animação com CSS que seria de um "sol" passando por uma imagem. A ideia era ter algo próximo desse resultado: Mas no meu código o "sol" fica pulando de um lado para o outro ...
hugocsl's user avatar
  • 66,9mil
3 votos
1 resposta
3mil visitas

css - always define standard rule 'keyframe' when defining keyframe Error

Estou recebendo erro no código abaixo que diz css - always define standard rule 'keyframe' when defining keyframe Error Ele é executado normalmente no Chrome, mas não está funcionando no IE 11 ...
Rafael Patricio da Cruz's user avatar
5 votos
1 resposta
143 visitas

Existe alguma forma de testar uma animação CSS pelo DevTools?

Tenho essa animação simples feita em CSS, porém estou tendo dificuldades para "debuggar" seu comportamento. Toda hora tenho que ir no código, salvar, e atualizar no browser. Existe alguma forma de ...
hugocsl's user avatar
  • 66,9mil
18 votos
1 resposta
8mil visitas

Como funciona o Cubic-Bezier em Animações com CSS?

Quando vamos fazer uma animação com CSS temos vários parâmetros que podemos usar. Ex: animation-name: none animation-duration: 0s animation-timing-function: ease animation-delay: 0s animation-...
hugocsl's user avatar
  • 66,9mil
9 votos
2 respostas
2mil visitas

Como fazer uma Animação em CSS com efeito de arrasto. Colocar blur no movimento

Estou querendo colocar um loader animado em CSS com @keyframes em uma página, mas gostaria de colocar nele um "efeito de arrasto" como se ele desse uma "embaçada" com um rastro de blur seguindo o ...
hugocsl's user avatar
  • 66,9mil
4 votos
2 respostas
193 visitas

Problema com @keyframes CSS

Estou fazendo uma animação com CSS mas o efeito fica correto apenas na primeira palavra do texto e o resto não. Alguém saberia o motivo disto ocorrer? h3{ position: absolute; font-family: ...
LeAndrade's user avatar
  • 9.046
1 voto
1 resposta
70 visitas

como fazer uma barra de progresso que vá de 0 a 70 e não volte do inicio?

Preciso de uma barra que vá de 0 a 70% e que não volte a 0 apos chegar nos 70, não pode recomeçar o ciclo, tem que parar quando chegar no numero maximo.~ @keyframes site { from { width: 0 } ...
Hector Rodrigues's user avatar
1 voto
1 resposta
152 visitas

@Keyframes, atributo 'animation-delay' não funciona dentro de um 'from' ou 'to'

Pretendo dar um 'delay' para essa animação mas não estou conseguindo da um atraso antes dela ir para o centro da página, se caso eu adicionar o 'animation-delay' dentro da class .ft ela já começa no ...
Elienay Junior's user avatar
1 voto
2 respostas
96 visitas

Animate CSS - Sintaxe correta?

Já tentei de diversas formas ajustar a animação simples de um @keyframes css ao qual estou fazendo. Ja vi diversas sintaxes e mesmo assim continuo com erro, .borda { padding: .5em; ...
user avatar
0 votos
0 respostas
94 visitas

Existe algo parecido com prioridade de comandos em jquery?

Eu estou criando uma página, e nessa página tem um menu lateral, e em cima da barra lateral tem um ícone de menu, que quando clicado faz a barra aparecer e desaparecer, pra desaparecer estou usando "...
zaque's user avatar
  • 333
3 votos
1 resposta
1mil visitas

Como não deixar uma Animação em CSS parar mesmo apos o mouse sair de cima do elemento

Tenho uma div que tem uma animação no :hover, porém se o usuário tirar o mouse de cima da div antes da animação terminar ela corta pela metade e não termina. Tentei fazer um efeito de "spot light" ...
hugocsl's user avatar
  • 66,9mil