לפעמים נרצה למשוך את עין הגולש אל אלמנט מסויים בעמוד או ליצור תחושה השראתית ומרגיעה.
על מנת לבצע זאת נוכל להשתמש באנימציית הנפשה בקצב נשימה.
נשים את קוד ה-CSS הבא תחת מתקדם > CSS מותאם באלמנט שבו נרצה שתחול האנימציה.
selector {
animation: breathing 4s ease-in-out infinite;
}
@keyframes breathing {
0% {
transform: scale(1);
}
50% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}
והנה התוצאה:
בהצלחה!