CSS Animation
Animation kullanarak kutumun sırasıyla 1,2,3 ve 4. basamağa gelmesini nasıl sağlayabilirim?
Görsel için: https://prnt.sc/247j0en
@keyframes haraket {
0% {
top: 0;
left: 0;
}
50% {
top: 0;
right: 0;
}
75%{
right: 0;
bottom: 0;
}
100% {
bottom: 0;
left: 0;
}
}
Bu kodları denedim ancak istediğim gibi çalışmadı. Bilgisi olan yardımcı olabilir mi?
@keyframes box
{
0%{
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
25% {
top: 0;
left: 0;
transform: translate(0, 0);
}
50% {
top:0;
left: 100%;
transform: translate(-100%, 0);
}
75% {
top: 100%;
left: 100%;
transform: translate(-100%, -100%);
}
100% {
top: 100%;
left: 0;
transform: translate(0, -100%);
}
}
```
Böyle yapabilirsin.