הוספת רכיב לסדר הכרטיסיות
הוספת רכיב לסדר הכרטיסיות הטבעי באמצעות tabindex="0"
. לדוגמה:
<div tabindex="0">Focus me with the TAB key</div>
כדי להתמקד ברכיב, מקישים על המקש Tab
או קוראים לשיטת focus()
של הרכיב.
הסרת רכיב מסדר הכרטיסיות
אפשר להסיר רכיב באמצעות tabindex="-1"
. לדוגמה:
<button tabindex="-1">Can't reach me with the TAB key!</button>
הפעולה הזו מסירה רכיב מסדר הכרטיסיות הטבעי, אבל עדיין אפשר להתמקד בו על ידי קריאה ל-method של focus()
.
שימו לב שהחלת tabindex="-1"
על רכיב מסוים לא משפיעה על הצאצאים שלו. אם הם נמצאים בסדר הכרטיסיות באופן טבעי או בגלל ערך tabindex
, הם יישארו בסדר הכרטיסיות.
כדי להסיר רכיב ואת כל הצאצאים שלו מסדר הכרטיסיות, אפשר להשתמש בפוליפיל inert
של WICG.
ה-polyfill מדמה את ההתנהגות של מאפיין inert
מוצע,
ומונע בחירה או קריאה של רכיבים על ידי טכנולוגיות מסייעות.
קדימה, מתחילים!
.loader {
animation: spin 0.75s infinite steps(var(--count));
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
חשוב לשים לב לשימוש ב-steps(var(--count))
כדי לקבל את האפקט הנכון ✨