Waa Maxay CSS Animations?
CSS Animations waa hab lagu dhaqaajiyo (animate) walxaha ku jira bogagga internetka iyadoo la adeegsanayo CSS kaliya, iyada oo aan la isticmaalin JavaScript ama teknolojiyado kale oo adag. Animations-ka CSS waxay awood kuu siinayaan inaad si tartiib ah u beddesho astaamaha walxaha sida midabka, cabbirka, xagal wareegga (rotation), muuqaalka (opacity), iyo booska (position).
 |
| How to use CSS animations |
Sida Loogu Isticmaalo CSS Animations
CSS animations waxaa loo sameeyaa iyadoo la adeegsanayo laba qaybood oo muhiim ah:
1️⃣ @keyframes: Waa meesha lagu qeexo isbeddellada animation-ka.
2️⃣ Animation properties: Waa astaamaha xakameeya sida animation-ka u shaqeynayo (waqtiga, xawaaraha, nooca, iwm.).
@keyframes midabkaBeddel {
0% { color: red; }
50% { color: blue; }
100% { color: green; }
}
h1 {
animation: midabkaBeddel 3s infinite;
}
2. Dabaqida Animation-ka
Kadib marka la dhiso keyframes, waa in lagu dabaqo walxaha la rabo.
@keyframes midabkaBeddel {
0% { color: red; }
50% { color: blue; }
100% { color: green; }
}
h1 {
animation: midabkaBeddel 3s infinite;
}
 |
| How to use CSS animations |
Tusaale Fudud oo CSS Animation Ah
Haddii aad rabto in walax si tartiib tartiib ah kor ugu dhaqaaqdo oo dib ugu laabato, waxaad isticmaali kartaa xeerkan:
@keyframes kor-iyo-hoos {
0% { transform: translateY(0px); }
50% { transform: translateY(-50px); }
100% { transform: translateY(0px); }
}
div {
width: 100px;
height: 100px;
background-color: red;
animation: kor-iyo-hoos 3s ease-in-out infinite;
}
 |
| How to use CSS animations |
Gunaanad
CSS animations waa hab fudud oo la isku qurxin karo boggaga internetka, iyada oo aan la adeegsanin JavaScript. Waxay kordhisaa waayo-aragnimada isticmaalaha (UX) waxayna ka dhigtaa bogga mid firfircoon. Haddii aad rabto in boggaaga uu noqdo mid casri ah oo soo jiidasho leh, waa lagama maarmaan inaad barato CSS animations!
Haddii aad rabto inaad wax badan ka barato CSS animations, isku day inaad ku tijaabiso xeerarkan oo aad sameyso animations gaar ah.