前の記事 ≪:2013年1月29日 管理人のブックマーク
次の記事 ≫:HTML5&CSS3なフリーのドロップダウンメニュー25

コンテンツ毎にサイドバーを固定配置できるjQueryプラグイン「Stick ’em」

2013年01月30日-はてなブックマーク

スポンサード リンク
[PR] 英単語を忘却曲線アプリを使って超効率よく記憶する方法
jQuery Stick ’em: Make Content Sticky on Scroll, to a Point | Viget

コンテンツ毎にサイドバーを固定配置できるjQueryプラグイン「Stick ’em」。
最近よくある、ページをスクロールしてもついてくるサイドバー。position:fixedなどを応用して綺麗についてくるようにできますが、コンテンツが大きく3つに分かれている場合はちょっと実装が難しいかも。
そんな時に使えるのがこのプラグイン。デモページを見て頂ければ分かりますが、コンテンツごとに固定されるサイドバーをわけられるようです。



スクロールしても、サイドバー「Heading」と書かれた部分は右側に固定されて表示されます。



更にスクロールするとコンテンツが別れるので、それ以上は下に来ません。



1から実装するとなるとpositionの切り替えが結構大変で挫折しがちなこの処理もプラグインで一発。素晴らしい。

関連エントリ
関連の記事検索:jQuery, スクロール, jQueryプラグイン, プラグイン
スポンサード リンク

By.KJ : 2013年01月30日 09:03 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)