[HTML] Colonna non scrolla quando arriva sopra la pagina

[Shyson]

Devo fare una cosa tipo la colonna sinistra di Facebook che quando la parte sotto appare, la colonna smette di scorrere, scorre solo il contenitore centrale.
I css sono quelli originali del sito, impostata così, il contenitore rimane bloccato, scorre solo la colonna.

/* Colonna laterale sx */
.site:before {
 
}

/* Contenitore centrale */
#content {
    position: fixed;
    right: 0;
    display: scroll;
  }

<script>
window.onload = function() {
     document.getElementById('content').onscroll = function() {
        console.log("scrolling");
      };
}
</script>

ho trovato anche questo, non so quale usare:

jQuery(document).ready(function($) {
    var menu = $("#content");
    var posizione = menu.position(); // intercettiamo qui l'evento "scroll"              
    $(window).scroll(function() { // "$(window).scrollTop()" ci dice di quanto abbiamo scrollato la pagina
        if ($(window).scrollTop() >= posizione.top) { // abbiamo scrollato oltre il div, dobbiamo bloccarlo
            menu.addClass(".site:before");
        } else { // abbiamo scrollato verso l'alto, sopra il div, possiamo sbloccarlo
            menu.removeClass(".site:before");
        }
    });
});