JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="logo_container"></div>
</div>

CSS

.wrapper {
    height:1000px
}
.logo_container {
    background:red;
    width:250px;
    height:500px;
    position:relative;
    margin:0px auto;
}

JavaScript

$(window).scroll(function () {
    var scrollTop = $(window).scrollTop();
    var height = $(window).height();
    $('.logo_container, .slogan').css({
        'opacity': ((height - scrollTop) / height)
    });
});