Jak uzyskać taki efekt ?

Witam, spodobał mi się pewien efekt na stronie. Ale zastanawiam się jak to zrobić. Chodzi mi o efekt ze tło jest nieruchome, a jak się przewija to elementy zakrywają tło. To ta strona: http://www.craftinity.com/

Z góry dziękuje za pomoc.

parallax https://ihatetomatoes.net/how-to-create-a-parallax-scrolling-website/

Ok, wielkie dzięki. Nie wiesz może jak można uzyskać podobny efekt bez tego pluginu sam css i js ?

Trochę matematyki, zabawy z interesującymi Cię właściwościami (np. position, (top/bottom/left/right), ew. transform jak wolisz, opacity, background-position i co tam sobie wymyślisz), no i badanie pozycji scrolla (scrollTop) w zdarzeniu scroll (zazwyczaj podpiętym do obiektu window).

Czyli np.

1. jeżeli scrollTop jest mniejsze niż 200, to element X
   ##ma opacity:0 i left: 100%,
   #jeżeli od 200-300 to w elemencie X
   ##ustawiasz opacity równe (scrollTop-200)/100 (0.0 dla 200, i 1.0 dla 300),
   ##ustawiasz left równe: 100-(scrollTop-200)% (100% dla 200, 0% dla 300),
   #jeżeli 300-400 to element X
   ##ma opacity:1 i left: 0%,
   .. i potem odwrotny efekt dla 400-500
   .. i ukrywasz element całkowicie dla >500

W ten sposób po przesunięciu strony 200px w dół zaczyna się krótka animacja najazdu jakiegoś elementu X (obrazka?) z płynną regulacją przeźroczystości z prawej strony ekranu i trwa to 100px. W kolejnych 100px (300-400) obrazek jest cały czas widoczny, i potem jak zaprogramujesz resztę - to odjeżdża w lewo poza ekran i zanika.

Znacznie prościej jednak użyć pluginu, który powyższą matematykę ogranicza do podania paru regułek.

Dzięki wielkie, bardzo fajnie napisane.