jQuery Masonryでボックス要素をきれいに整列してみた。

自分のサイトがPinterestみたいな見た目になったらカッコいいよなぁ。と思って、似たようなことをできるものを探してみたら、「jQuery Masonry」というjQueryのプラグインを見つけました。

公式サイトに記載されている通り、Masonryは 動的なグリッドレイアウトをお手軽に利用できるプラグイン。

基本的な1カラム、複数カラムに対応し、画像やアニメーション、無限スクリーンなど、いろんなことが簡単にできるとのことだったので、実際に使ってみました。
(無限ローディングの部分は、infinite-scrollを使用)

jQuery Masonryを利用した、動的グリッドレイアウト – サンプルとか

jQuery Masonryは特に面倒なところがなかったけど、Infinite ScrollはローディングエリアのCSSを定義したり、ローディング先のデータを整えたりとちょっと面倒だった。
今作っているサービスに入れてみるか。