Puedes hacerlo con la propiedad CSS position: sticky;
sin necesitar el uso de javascript, espero que sea lo que necesites,.
Explicación:
El div con el id myDIV con la regla CSS position: sticky;
es tratado como un elemento posicionado relativamente hasta que su bloque contenedor cruza un límite establecido (como por ejemplo dando a top cualquier valor distinto de auto), en este caso es top:0;
Fuente de explicación: position- CSS
Ejemplo:
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo</title>
<style>
#myDIV {
position: sticky;
top: 0;
z-index: 1;
}
.box {
padding: 2rem;
margin: 2rem;
color: #fff;
}
.box-lg {
padding: 7rem 2rem;
}
.bg-red {
background-color: red;
}
.bg-blue {
background-color: blue;
}
</style>
</head>
<body>
<div id="myDIV" class="box bg-red">Menu</div>
<div class="box box-lg bg-blue">Caja 1</div>
<div class="box box-lg bg-blue">Caja 2</div>
<div class="box box-lg bg-blue">Caja 3</div>
<div class="box box-lg bg-blue">Caja 4</div>
<div class="box box-lg bg-blue">Caja 5</div>
</body>
</html>