javascript - フレキシブル グリッド ビューを実装するライブラリはありますか?

Question

実は私は適切な言葉を知りません。私が意味したのは、画像の幅と高さの比率に柔軟に対応できるこのビジュアライゼーションです。( http://www.eecs.mit.edu/people/faculty-advisors )

このビューを実装するのを手伝ってくれませんか? このような画像をいくつか表示したいと思います。

ライブラリやサンプルコードはありますか? これはjQueryで実装されていますか?

前もって感謝します。

Answer 1

これを攻撃するには、主に 2 つの方法があります。1 つは、ブートストラップのレスポンシブ CSS です。デモについては、このフィドルを参照してください: http://jsfiddle.net/tylergreen/9v296/

<link rel="stylesheet" type="text/css" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css">
<div class="container">
    <div class="row">
        <div id="grid" class="span9">
            &lt;div class="span3">
                <img class="img-polaroid" src="http://example.com/image1.jpg" alt=""/>
            </div>
            &lt;div class="span3">
                <img class="img-polaroid" src="http://example.com/image2.jpg" alt=""/>
            </div>
            etc...
         </div>
    </div>
</div>

もう 1 つの方法は、Masonry のような jQuery の「動的グリッド」プラグインを使用することです。