css מאפייני scroll scroll-timeline

scroll-timeline CSS Style Property

המאפיין scroll-timeline משמש להגדרת ציר זמן בעל שם שמניע את ההתקדמות של סרגל הגלילה במיכל. לאחר מכן מופנה השם בהצהרת ציר זמן של אנימציה כדי לציין את הרכיב של המיכל המשמש להנעת התקדמות האנימציה באמצעות פעולת הגלילה.

לחלופין, ניתן לציין את ציר הגלילה של פס הגלילה. מיקום הגלילה ההתחלתי מייצג התקדמות של 0% ומיקום הגלילה הסיום מייצג התקדמות של 100%. אם מיקום 0% ומיקום 100% חופפים (כלומר, למיכל הגלילה אין גלישה), ציר הזמן אינו פעיל.

הערה: אם האלמנט אינו מציף את המיכל שלו בממד הציר או אם הגלישה מוסתרת או נחתכת, לא ייווצר ציר זמן.

דוגמא: הגדרת ציר זמן גלילה

Demo Panel:
Item 1
Item 2
Item 3
Item 4
CSS: 111
HTML: 222
Syntax:

Valid values:
  • none block, none inline, none, none x, none y, revert, revert-layer, unset, inherit, initial

Js Syntax: element.style.scrollTimeline

תאימות דפדפנים

scroll-timeline
הערך שנבדקChromeFirefoxEdgeCOpera
revert✔️✔️✔️
revert-layer✔️✔️✔️
unset✔️✔️✔️
inherit✔️✔️✔️
initial✔️✔️✔️
custom_name block
block
inline
vertical
horizontal