CSS анимация
Here a codePen with cool animations:
https://codepen.io/DevLorenzo/pen/ExgpvJM
DevLorenzo
Here a codePen with cool animations:
https://codepen.io/DevLorenzo/pen/ExgpvJM#anim {
animation-name: colorful;
animation-duration: 3s;
}
@keyframes colorful {
0% {
background-color: blue;
}
100% {
background-color: yellow;
}
}.wrapper {
display: flex;
justify-content: center;
align-items: center;
height: 100vh
}
.pulse {
width: 70px;
height: 70px;
background-color: red;
border-radius: 50%;
position: relative;
animation: animate 3s linear infinite
}Read this helpful, short and straightforward article to learn CSS animation perfectly.
https://medium.com/@Cafe_Code/learn-css-animation-asap-as-simple-as-possible-374b7874d4dd@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;
}<div class="cssanimation hu__hu__"> Example </div>