Стили, которые зависят от направления прокрутки со scroll-state(scrolled). Юна Кравец о новой функции scroll-state() для выражений от контейнера в Chrome 144. Она позволит применять стили шапки, тулбаров и других элементов в зависимости от направления прокрутки без JS и прогрессивно улучшать интерфейсы со статическим фолбеком. #css #scroll

https://una.im/scroll-state-scrolled

Выражения scroll-state от контейнера в CSS теперь определяют прокрутку. Брехт де Рёйте рассказывает о новом состоянии scrolled для @container в Chrome 144 и о stuck, snapped и scrollable из Chrome 133, чтобы делать прячущиеся шапки, подсказки и стрелки прокрутки на чистом CSS. #css #scroll

https://utilitybend.com/blog/is-it-scrolled-is-it-not-lets-find-out-with-css-container-scroll-state-queries/

Анимации, управляемые прокруткой. Джош Комо разбирает CSS animation-timeline, где кадры анимации раскладываются по расстоянию прокрутки, а не по времени. Рассказывает про функции тайминга, диапазоны анимации (cover, contain, entry, exit), проценты диапазонов, таймлайны прогресса прокрутки и связанные таймлайны через view-timeline и timeline-scope. Поддержка около 85%, в Firefox — за флагом. #scroll #animation

https://www.joshwcomeau.com/animation/scroll-driven-animations/