Cambiar color de un div cuando se hace scroll js

Tengo un nav con el id “navbar”. Que quiero que al hacer scroll hacia abajo, cambie de color por lo cual tengo el siguient metodo:

window.addEventListener("DOMContentLoaded" , () => {         var element = document.getElementById("navbar");         document.addEventListener("scroll", () => {         element.setAttribute("style","background-color: rgba(255,255,255,10)");         });     }); 

Funciona, si, pero no se me ocurre la forma de hacer que cambie el color en una cierta cantidad de pixeles, al igual que en ves de hacer un setAttribute haga una incersion de una clase al elemento PD: es js puro