¡Bienvenido a stackoverflow!


El ejemplo consiste en un contenido web de 3 cajas con un alto aproximado de 3000px, para que se pueda probar en pantalla completa.
El background comienza en rojo y una vez sobrepasas el breakpoint "punto de rotura" o marcado, en este caso en 1000px, cambia a verde, y de vuelta al regresar se torna rojo de nuevo. 
He agregado de forma adicional un `console.log` para facilitar la comprensión del scroll y el píxel en el que se encuentra.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    $(document).ready(function() {
      const breakpoint = 1000;

      $(window).scroll(function() {
        toggleActionByBreakpoint(breakpoint)
      })

      function toggleActionByBreakpoint(breakpoint) {
        console.log($(this).scrollTop());
        const isScrollOnPosition = $(this).scrollTop() > breakpoint;
        const isScrollReturnedPosition = $(this).scrollTop() < breakpoint;
        if (isScrollOnPosition) {
          $("body").css('background-color', 'green');
        };
        if (isScrollReturnedPosition) {
          $("body").css('background-color', 'red');
        }
      }
    });

<!-- language: lang-css -->

    #separator {
      margin-top: 1000px;
    }
    #separator-2 {
      margin-top: 100px;
      margin-bottom: 50px;
    }
    #position-to-detect {
      margin-top: 50px;
      margin-bottom: 2000px;
    }
    body {
      background-color: red;
    }

<!-- language: lang-html -->

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Action on scroll position</title>
    </head>
    <body>
      <div id="separator"></div>
      1000px
      <div id="separator-2"></div>
      1100px
      <div id="position-to-detect"></div> 
      1150px
    </body>
    </html>

<!-- end snippet -->


Ya que en muchas ocasiones cuando realizamos una acción en un sentido (sobrepasar un punto de scroll en pantalla) suele ser necesario o común buscar la acción de regreso,"volver al estado inicial".

Te expongo un ejemplo muy sencillo, completo y funcional donde podrás observar como funciona. Puede que no sea necesario en tu caso retornar al valor inicial, en tal caso solo sería eliminar la segunda condición y función.

Creo que el código queda algo mas estructurado y legible realizando el control con una función específica a modo de `toggle`(activado | desactivado).

Como he visto que haces uso de Jquery, aprovechemos esta librería para un código mas sencillo y rápido, en caso que neceistes que sea si o si en Javascript, creo que es facil adaptarlo, si te ves con problemas comenta y enriquecemos la respuesta, al final JQuery es azucar sintáctico.


Explicación del ejemplo.

No olvides marcar la respuesta como "válida y/o resuelta si soluciona el problema con el fin de ayudar a otros a enriquecerse del contenido.

Espero que te ayude!

Saludos!