stackgrid.adem.js

JavaScript

コンテンツをグリッド状にスタッキングできる「stackgrid.adem.js」

stackgrid.adem.jsはコンテンツをグリッド状にスタッキングしていくことができます。コンテンツ間の余白やカラムのワイド幅などを指定することが可能になっているので、細かいカスタマイズをしたい場合にはとても便利ですね。

stackgrid.adem.js

デモ

デモではSmall、Medium、Largeから各サイズのコンテンツをスタックしていくことができる他、Gutter Onで余白を入れて、Gutter Offで余白を無くすことができます。

また、フレキシブルなレイアウトになっているので、ブラウザ幅を可変させることでコンテンツがアニメーションしながら再配置されます。

他にもデモメニューにあるFluidをクリックすれば横幅いっぱいに広がったレイアウトを見ることができます。

ダイナミックに切り替わっていくスタッキング可能なグリッドレイアウトを実装したい方は是非チェックしてみてください。

stackgrid.adem.js

関連記事

  1. Letter Drop

    JavaScript

    雨のように文字が落ちてくるアニメーションのjQueryプラグイン「Letter Drop」

    Letter DropというjQueryプラグインを使えば、雨のように…

  2. Tagify

    JavaScript

    Vanilla JSを用いた軽量のタグ入力機能を実装できる「Tagify」

    TagifyはVanilla JSを用いた軽量のタグ入力機能を実装でき…

  3. JavaScript

    jQueryプラグイン・2014年上半期56選まとめ

    気づいたら2014年も上半期が終わってしまいましたね。そんなわけで、2…

  4. CaptionerJs

    JavaScript

    画像に開閉できるキャプションを実装できるjQueryプラグイン「CaptionerJs」

    CaptionerJsは画像に開閉できるキャプションを実装することがで…

  5. Product comparison

    JavaScript

    製品などの比較に役立つjQueryプラグイン「Product comparison」

    Product comparisonは、いくつかの種類のものを比較する…

  6. jquery.square.js

    JavaScript

    スクエアなグリッドレイアウトを実装できる「jquery.square.js」

    jquery.square.jsは、スクエアなグリッドレイアウトを実装…

最近の記事

  1. NIB2600
  2. Anker PowerPort Atom PD 4
  3. USB-2H401BKN
  4. Dyson Pure Cool Me

アーカイブ

PAGE TOP