JavaScriptを使用して複合画像グリッドをプログラミングする方法

Question

ポートフォリオのWebサイトでは、画像の視覚的グリッドを開発する必要があります。

私は今、このグリッドのテストを行っています。

私は2つの選択肢があります：

1.Aシンプルなグリッドを、縦断線形を持つは、このワイヤフレームのいずれかのよう：http://daviddarx.com/stuffs/work/barbu/wireframe/search/simple.png

それを行うには、いくつかのプラグインがありますが、私は簡単に開発することができ必要に応じてカスタムソリューション。しかし、このグリッドはややシンプルで一般的です。私はこの1つのような、よりCOMPLEXEグリッドを取得するのが大好きだ：

2.A COMPLEXEグリッド、は、任意の垂直または水平方向の配置せずに、このワイヤフレームのいずれかのよう： http://daviddarx.com/stuffs/work/barbu/wireframe/search/complexe.png

しかし、この1のために、私は実際にそれを開発する方法を概念的に見ていません。
ここに私の質問があります：

- 私は私が欲しいものを得るためにカスタムグリッドを開発したいと思っています。このようなグリッドの作成方法についてのアドバイス、戦略、チュートリアルはありますか？どのステップ、どのように起動するか、など...

- それ以外の場合は、それを達成できるプラグインまたはライブラリがありますか？

ありがとうございました！ デビッドこのjQueryプラグインは、あなたがやりたいかもしれません

Answer 1

：http://isotope.metafizzy.co/

をそれはそれをしない場合は、理由を説明してくださいと私は別の解決策を考えることができるかどうかを確認しようとするでしょう。

Answer 2

jQueryプラグインのmasonryを使用できます。あなた自身でそれをやりたければ、ツリーマップアルゴリズムを使うことができますが、jQueryプラグインのツリーマップもあります。