スクロールしてもサイドバーの一部が消えずについてくるjQuery

【jQuery】スクロール時に指定位置で要素を固定させるscrollfix.js
http://wild-cards.net/jquery-scrollfix/

まずはjQuery
HTML

<link href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"/></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js" type="text/javascript"/></script>

次にheadの閉じタグ直前に以下を追加

<script type="text/javascript">
/*スクロール固定*/
$(window).load(function() {
	var tab = $('.scrollfix'), //固定したい要素名
    offset = tab.offset();

$(window).scroll(function () {
  if($(window).scrollTop() > offset.top) {
    tab.addClass('fixed');
  } else {
    tab.removeClass('fixed');
  }
});
});
</script>

CSS

/*親要素*/
#side {
    width: 340px;
    position: relative;
    float: left;
}
/*固定したい子要素*/
.scrollfix {
    width: 340px;
    height: 200px;
    background: #ff0000;
}
/*子要素を固定する位置(TOPからの距離)*/
.fixed {
    position: fixed;
    top: 100px;
}


コメントは受け付けていません。