Как сделать заливку при скролле?

Question

[twixoff]

Новогодний оливье блокирует мыслительные процессы)
Подскажите, как сделать заливку текста и линий + кругов при прокрутке страницы? Заливать надо серое синим цветом, сверху вниз.

Answer 1

[Oogway]

Вот например codyhouse.co/demo/icons-filling-effect там статья с пояснениями есть

Comments

[Oogway]

Перевод статьи lopart.by/e-ffekt-zapolneniya-ikonok

[twixoff]

Oogway: Благодарю!

[Oogway]

twixoff: пометь как решение, если помогло)

[L0k1]

вот scrollr плагин, который вам может помочь, ибо приведенная выше статья не решает вопрос заливки текста

Answer 2

[Владик Лимонадик]

Видно вы много оливье скушали, раз думаете, что в CSS можно отслеживать скролл.

Тут надо JS, и немало причем. Или либу найти делающую похожее.

jsfiddle.net/cgspicer/V4qh9

Как вариант дичайшего костыля, создать элементы с каждым шагом и спрятать их.

И при скролле через DOM-манипуляции заменять одно на другое, этол если вам лень писать нормальный js

Comments

[twixoff]

Я не говорил, что css может отслеживать скролл) Видимо у вас тоже салат в голове? ;) Спасибо за ответ.