Как заставить свиток изменять непрозрачность некоторых элементов - PullRequest
Новая
       15

Как заставить свиток изменять непрозрачность некоторых элементов

0 голосов
/ 09 марта 2020

Я ищу простой способ изменить непрозрачность элементов моей сетки при прокрутке. Идея состоит в том, что у меня есть маленькое меню внизу моей страницы, и поэтому всегда видно, что я хочу, чтобы элементы позади не были в полной непрозрачности, пока они не достигнут над моим меню (и так при прокрутке).

Я не профессионал, поэтому чем проще, тем лучше!

Моя сетка HTML выглядит так: 

<div class="grid">

        <div class="thumbnail" style="width: 50%; left: 50%; top: 0vw;">
            <a href="#"><img src="img/img-1.jpg" class="image"></a>
            <div class="infos"><strong>Music Video</strong><br><em>Project Name</em> 2019</div>
        </div>

        <div class="thumbnail" style="width: 60%; left: 50%; top: 30vw;">
            <a href="#"><img src="img/img-2.jpg" class="image"></a>
            <div class="infos"><strong>Type</strong><br><em>Project Name</em> 2018</div>
        </div>

        <div class="thumbnail" style="width: 45%; left: 50%; top: 60vw;">
            <a href="#"><img src="img/img-3.png" class="image"></a>
            <div class="infos"><strong>Type</strong><br><em>Project Name</em> 2020</div>
        </div>
...