Как сделать такой же эффект скрытия?

Question

[Scryppi]

Как сделать такой или похожий эффект скрытия текста в верхнем баннере при скролле, как на этом сайте one.modern.themerella.com Есть какие то готовые решения для таких анимаций?

Answer 1

[Vitaliy]

Родительскому блоку задать
perspective: 1200px;

У блока, который хотите трансформировать, по событию скролла меняете
'transform: rotateX('+angle+'deg)'
где angle - угол, на который нужно наклонить блок
Можно вычислить так: angle = window.scrollY/window.innerHeight*60

P.S. Чтобы узнать, как устроены подобные вещи, просто смотрите в Devtools

Comments

[Scryppi]

спасибо, я открывал Devtools но там все очень запутанно и непонятно.