Sponsored by:
Sponsored by:
Samil Vargas
Payment System Developer at @Wirecard
Sponsored by:
The content provided on this presentation has only been proved with Chrome +65. Any other browser or Chrome version has no warranty to work.
Sponsored by:
"Process of giving movement sensation to an unanimated object"
Sponsored by:
Sponsored by:
Sponsored by:
.mustage {
width: 180px;
height: 180px;
left: 100px;
position: absolute;
border-radius: 50%;
box-shadow:
150px 240px 0 0 currentColor,
300px 240px 0 0 currentColor;
}
.mustage::before {
content: '';
position: absolute;
left: 30px;
top: 120px;
width: 210px;
height: 120px;
border-bottom: solid 180px currentColor;
border-radius: 0 0 0 100%;
transform: rotate(-40deg);
transform-origin: right 210px;
}
.mustage::after {
content: '';
position: absolute;
left: 390px;
top: 120px;
width: 210px;
height: 120px;
border-bottom: solid 180px currentColor;
border-radius: 0 0 100% 0;
transform: rotate(40deg);
transform-origin: left 210px;
}
Sponsored by:
<div class="mustage"></div>
Sponsored by:
.mustage {
animation-name: example;
animation-duration: 4s;
animation-delay: 2s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
Sponsored by:
These specify what the animation does.
@keyframes example {
from {background-color: red;}
to {background-color: yellow;}
}
@keyframes shakeLeft {
0% {
transform: rotate(-50deg);
}
50% {
transform: rotate(-30deg);
}
100% {
transform: rotate(-50deg);
}
}
Sponsored by: