Parallax effect – hero image overlayed/stack by content

Question

I came across the website for the Moonlight Movie: http://moonlight.movie/

In the top there is a fullscreen image, when scrolling this is being overlayed by a fullscreen section.

It is a niffty little parallax-like effect, that also works on mobile (ios)

Does anybody know how to achieve this effect?

score 0 · Answer 1 · answered Mar 29 '17 at 16:08

0

I would encourage you to check pagePiling.js or the parallax fullPage.js extension with an offset of 100%.

If you opt to use pagePiling.js here's an article that explains how to achieve something similar with it.

answered Mar 29 '17 at 16:08

Alvaro

Thanks I will try these - they seem to be something that could work – DWTBC Mar 29 '17 at 17:25

1 Answers1