Я хочу, чтобы на странице было много блоков текста, но хотелось бы, чтобы, когда пользователь прокручивает текущий блок, исчезает, а новый сместится. Таким образом, это всего лишь повторный процесс для каждого блока текста, который у меня есть. Я хочу добиться аналогичного эффекта, как на this website. Я ищу решение с использованием чистого CSS.Увядание прокрутки
очень грубый пример в чистом CSS, очевидно, вы хотите больше див и т.д.
div{width:100%;}
.a{background-color:white;opacity:0.7;}
.b{background-color:white;opacity:0.4;}
.c{background-color:white;opacity:0;}
#top{position:fixed;top:0%;min-height:15%;}
#topdown{position:fixed;top:15%;min-height:15%;}
#middle{position:fixed;top:30%;min-height:40%;}
#downtop{position:fixed;top:70%;min-height:15%;}
#bottom{position:fixed;top:85%;min-height:15%;}<div id="top" class="a"> </div>
<div id="topdown" class="b"> </div>
<div id="middle" class="c"> </div>
<div id="downtop" class="b"> </div>
<div id="bottom" class="a"> </div>
<div id="main">extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text vextremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text vextremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text vextremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text vextremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text vextremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text extremely long text </div>хотел бы, чтобы downvoter объяснил почему? – Billy
Вы свой вопрос с пометкой 'javascript', но уже в теле чистого CSS; что он? – Sablefoste
Это, вероятно, нецелесообразно, используя только css. –