header

Менять прозрачность фона при прокрутке страницы

<div  class="opacity_bg">

</div>

<script>
    window.addEventListener('scroll', function() {
        const scrolled = window.pageYOffset;
        const background = document.querySelector('.opacity_bg');
        background.style.backgroundPositionY = -(scrolled * 0.1) + 'px';

        // Изменяем прозрачность в зависимости от прокрутки
        const maxScroll = document.body.scrollHeight - window.innerHeight;
        const opacity = 1 - (scrolled / maxScroll);
        background.style.opacity = opacity;
    });
</script>
body{background:#fff;}
.opacity_bg{height:1000vh;background:#000;}

Возврат к списку