What I'm trying to do with javascript is:
Once you scroll so far down the page, change the position of #sidebar-box-fixed from position: relative; to position: fixed;. Change back to position: relative; once you scroll back up.
What would be the easiest way to do this?
You could try something in this direction:
$(document).ready(function() {
var gap = 100;
$(window).on('scroll', function(){
var position = $(window).scrollTop() > gap ? 'fixed' : 'relative';
$("#sidebar-box-fixed").css('position', position);
});
});