Как реализовать pull to refresh?

Middle
146 просмотров
AFK Offer AI

Touch events: touchstart (запомни startY), touchmove (считай deltaY, показывай индикатор если скролл вверху), touchend (если delta > threshold — refresh). Условие: window.scrollY === 0 && deltaY > 0. Индикатор: translateY элемент вниз, показать spinner. Анимация: transition при отпускании. overscroll-behavior: contain предотвращает нативный pull-to-refresh в Chrome. После загрузки: скрыть индикатор с анимацией. Pointer Events вместо Touch для универсальности. Haptic feedback на мобильных через vibrate API.

Следующий вопрос

Что такое container queries?