Переключить скрытие/показ текста при прокрутке ⇐ CSS

[Anonymous]

Содержимое исчезает при прокрутке, как я хочу, но затем снова появляется на веб-сайте, я не хочу, чтобы оно снова появлялось
Попробовал создать анимацию при прокрутке и ожидал, что объект анимировать при прокрутке и больше не появляться при прокрутке. Анимация и все остальное работает отлично, но проблема возникает сразу после анимации.
Это анимация перед прокруткой.
Это после прокрутки. анимации, я не хочу, чтобы текст «прокрутки вниз» больше появлялся после прокрутки вниз.
Вот CSS-код для анимации прокрутки:
.scrolldown{
position: fixed;
font-size: 10px;
font-weight: 600;
left:45px;
writing-mode: vertical-lr;
height: 200px;
bottom:0;
color: rgba(129, 128, 128, 0.5);
text-transform: uppercase;
letter-spacing: 2px;
z-index: -1;
width: 30px;
line-height: 30px;
animation: scroll-in 1.2s;
animation-timing-function: ease-in-out;
&::after{
content:"";
display: block;
position: absolute;

width: 1px;
background-color: rgba(62, 51, 49,0.5);
opacity:0;
bottom:0px;
left:15px;
animation: scroll-in 1.8s;
animation-timing-function: ease-in-out;

}
}


Подробнее здесь: https://stackoverflow.com/questions/786 ... -on-scroll