Задать вопрос

Как сделать эффект прозрачности, привязанный к скроллу?

Добрый день. Есть фрагмент страницы, по высоте всегда равный высоте окна браузера, независимо от разрешения. При скролле вниз этот экран должен постепенно становиться прозрачным. При обратном скролле - наоборот. Полагаю, что во время скролла динамически должно меняться значение opacity у этого блока - от 1 до 0 и обратно. Подскажите, в какую сторону смотреть, в каким величинам привязываться и т.д., чтобы реализовать искомое? Может, как-то значения положения скролла преобразовывать в parseFloat от 0 до 1? Но ведь при скролле вниз - значение положения скролла увеличивается, в то время как мне надо, чтобы значение opacity - уменьшалось. Полагаю, что тут больше вопрос математики, нежели чистого кода, поэтому важно, чтобы это решение было максимально экономичным с точки зрения производительности. Думаю, что какие сложные расчеты будут тормозить страницу.
  • Вопрос задан
  • 665 просмотров
Подписаться 2 Средний 1 комментарий
Ответ пользователя Pavel Shvedov К ответам на вопрос (3)
mmmaaak
@mmmaaak
1 - Количество проскролленых пикселей разделить на высоту всего документа
Ответ написан
Комментировать