JSFiddle - React, Tailwind, and code Playground

HTML

<body>
</body>

CSS

body {
    height: 5000px;
    background: url(http://ftp.freenet.de/pub/ftp.gnome.org/pub/GNOME/teams/art.gnome.org/backgrounds/ABSTRACT-ZenSquares_1600x1200.png) 50% 0 no-repeat;
}

JavaScript

window.onscroll = function() {
    if (window.pageYOffset >= 500) {
        document.body.style.backgroundAttachment = "fixed";
        document.body.style.backgroundPosition = "50% -500px";
    } else {
        document.body.style.backgroundAttachment = "scroll";
        document.body.style.backgroundPosition = "50% 0";
    }
}