/
githubmirror
/
ionic
Обзор
Документация
Войти
/
githubmirror
/
ionic
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
core/src/components/footer/footer.utils.ts
35 строк
1 KB
Maria Hutt
refactor(many): use utils import (#27160)
12 апр 2023, 23:25
Не верифицирован
12 апр 2023, 23:25
0a0345a
Код
Авторство
О чём код?
import { readTask, writeTask } from '@stencil/core'; import { clamp } from '@utils/helpers'; export const handleFooterFade = (scrollEl: HTMLElement, baseEl: HTMLElement) => { readTask(() => { const scrollTop = scrollEl.scrollTop; const maxScroll = scrollEl.scrollHeight - scrollEl.clientHeight; /** * Toolbar background will fade * out over fadeDuration in pixels. */ const fadeDuration = 10; /** * Begin fading out maxScroll - 30px * from the bottom of the content. * Also determine how close we are * to starting the fade. If we are * before the starting point, the * scale value will get clamped to 0. * If we are after the maxScroll (rubber * band scrolling), the scale value will * get clamped to 1. */ const fadeStart = maxScroll - fadeDuration; const distanceToStart = scrollTop - fadeStart; const scale = clamp(0, 1 - distanceToStart / fadeDuration, 1); writeTask(() => { baseEl.style.setProperty('--opacity-scale', scale.toString()); }); }); };