“Propriedades de animação CSS” Respostas de código

CSS abreviada de animação

animation: name time func delay iteration dir fill play;
animation: none 0s ease 0s 1 normal none running;
Breakable Barracuda

Animações CSS

Here a codePen with cool animations:
https://codepen.io/DevLorenzo/pen/ExgpvJM
DevLorenzo

Propriedades de animação CSS

body{
background-color: purple;
}

@keyframes party{
    0% {background-color: red;}
    10% {background-color: orange;}
    20% {background-color: yellow;}
    30% {background-color: green;}
    40% {background-color: blue;}
    50% {background-color: purple;} 
}

@-webkit-keyframes party{
    0% {background-color: red;}
    10% {background-color: orange;}
    20% {background-color: yellow;}
    30% {background-color: green;}
    40% {background-color: blue;}
    50% {background-color: purple;} 
}
Yucky Yak

Animações CSS

window.addEventListener('scroll', () => {
  document.body.style.setProperty('--scroll',window.pageYOffset / (document.body.offsetHeight - window.innerHeight));
}, false);
Shy Salmon

Animação CSS

@keyframes animatedBackground {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 100% 0;
  }
}
#animate-area {
  width: 200px;
  height: 200px;
  background-image: url(http://placekitten.com/400/200);
  background-position: 0px 0px;
  background-repeat: repeat-x;
  animation: animatedBackground 10s linear infinite alternate;
}
Troubled Trout

Propriedades de animação CSS

function party(){
  document.body.style.animation = 'party 2.5s infinite linear';
}
Yucky Yak

Respostas semelhantes a “Propriedades de animação CSS”

Perguntas semelhantes a “Propriedades de animação CSS”

Mais respostas relacionadas para “Propriedades de animação CSS” em CSS

Procure respostas de código populares por idioma

Procurar outros idiomas de código