Anyone know how to do this overlapping effect when scrolling?

What i want to archieve is something like on this site: http://www.soleilnoir.net/believein/#/start

thanks in advance.

It’s not that simple. The javacsript is accessible here for you to study http://www.soleilnoir.net/believein/js/voeux.js

They are getting the height of the window to know the size of each slide.
Every slide is positioned on top of each other and there’s javascript responding to the scroll.
Here’s the basics of what a script like that does


var slides = $('.slide')
var slideHeight = $(window).height();
$(window).on('scroll', function(event) {
  var top = $(window).scrollTop()
  // set height / position of slides based on scroll
});

Open up an Inspector and watch what properties are being changed when you scroll to get an idea of how to implement it.