Как сделать такой эффект смены фона?

Question

[mndgreen_world]

Зашел на сайт Tilda Publishing и начал скроллить. Зацепила меня идея сменый картинки при скролле, интересным образом. Пытался додуматься, как это происходит, но бесполезно. Может кто-то подсказать, как это работает, желательно с примером? Хотелось бы попробовать самому такое сделать. Заранее спасибо;)

Answer 1

[Павел Чесноков]

Это несколько блоков, идущих друг за другом с верху в низ, например:

<div> … </div>
<div> … </div>
<div> … </div>

Для каждого из них установлены в качестве фона разные картинки одинакового размера, которые с помощью CSS растянуты на весь экран и фиксированы по отношению к окну браузера:

div {
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('http://...');
}

Answer 2

[Дмитрий Ковальский]

plugins.jquery.com/?s=scroll Попробуйте здесь покопать.
Например - johnpolacek.github.io/scrollorama

Answer 3

[Алексей Уколов]

Нажмите на том сайте F12 - вот вам готовый пример.