make an element on page "stick" while rest of page scrolls

sitckyElement.js

$(document).ready(function () {
   $(window).scroll(function(e){ 
     $element = $('#element-id'); 
   var init_height = 250;
     if ($(this).scrollTop() > init_height && $element.css('position') != 'fixed'){ 
       $('#element-id').css({'position': 'fixed', 'top': '0px'}); 
     } else if ($(this).scrollTop() < init_height && $element.css('position') == 'fixed'){ 
       $('#element-id').css({'position': 'relative'}); 
     }
   });
});