Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.
- Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
- Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
- Internet Explorer / Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
- Opera: Нажмите Ctrl+F5.
const animItems = document.querySelectorAll('._anim_items'); if(animItems.length > 0){ window.addEventListener('scroll', animOnScroll); function animOnScroll(params) { for (let index=0; index < animItems.length; index++) { const animItem = animItems[index]; const animItemHeight = animItem.offsetHeight; const animItemOffset = offset(animItem).top; const animStart = 4; let animItemPoint = window.innerHeight - animItemHeight / animStart; if(animItemHeight > window.innerHeight){ animItemPoint = window.innerHeight - window.innerHeight / animStart; } if((pageYOffset > animItemOffset - animItemPoint) && pageYOffset < (animItemOffset + animItemHeight)){ animItem.classList.add('_active'); } else { animItem.classList.remove('_active'); } } } function offset(e1) { const rect = e1.getBoundingClientRect(), scrollLeft = window.pageXOffset || document.documentElement.scrollLeft, scrollTop = window.pageYOffset || document.documentElement.scrollTop; return { top: rect.top + scrollTop, left: rect.left + scrollLeft } } animOnScroll(); }