Simple jQuery Sticky-on-Scroll Navigation

sticky-on-scroll.css

#wrapper { position: relative; }

/* Aside in non-scroll mode */
aside {
 float: left; /* Keeps the aside to the left and on top */
 margin-top: 5px;
 padding: 15px 0 15px 8px;
 width: 267px;
}

sticky-on-scroll.html

<div id="wrapper">
  <aside>
    <p>Content to keep on the side and at the top when scrolled.</p>
  </aside>
</div>

sticky-on-scroll.js

/**
 Set the scroll events for the HTML5 Scroll Load plugin and keeping the aside always in view.
 */
var asideTop = $('aside').offset().top - parseFloat($('aside').css('marginTop').replace(/auto/, 0));
$(window).scroll(function () {
    var asideY = $(this).scrollTop();
    if (asideY >= asideTop) {
        $('aside').css({
            position: 'fixed',
            top: '0px'
        })
    } else {
        $('aside').removeAttr('style')
    }
});