jQueryで作るスクロール追随型サイドメニュー

スクロールしても表示されるサイドメニューが必要になったので簡単に書いてみた。

onScroll 時に position の値を変更するだけの簡単な作業です。
アニメーションも必要無し。アニメーションでぬるっと動くようなものであれば .css() のかわりに .animate() 使えば良いのだろうか。試してないけど。

$(document).ready(function() {
	var sidebar = $("#sidebar");
	var _window = $(window);
	var offset  = sidebar.offset();
	var topPadding = 50;
	_window.scroll(function() {
		if (_window.scrollTop() > offset.top) {
			sidebar.css({marginTop:_window.scrollTop() - offset.top + topPadding });
		} else {
			sidebar.css({marginTop:0});
		}
	});
});

jQuery書くのはJavaScript書くのとはちょっと違う気がする。jQuery便利すぎる。