[jQuery] jQueryAutoHeight: div box の高さを揃える

並べた複数の div box の高さを揃える。

通常、下記のように高さが揃わない。

プラグインを利用して揃えてみる。

Contents

License

記載無し

Browser Support

Firefox, Chrome, Safari, iOS, (Android), IE9+

Installation

Bower からダウンロードできるが、設置は手動。

% bower info jQueryAutoHeight
bower not-cached    git://github.com/tinybeans/jQueryAutoHeight.git#*
bower resolve       git://github.com/tinybeans/jQueryAutoHeight.git#*
bower checkout      jQueryAutoHeight#master
bower invalid-meta  jQueryAutoHeight is missing "main" entry in bower.json
bower invalid-meta  jQueryAutoHeight is missing "ignore" entry in bower.json
bower resolved      git://github.com/tinybeans/jQueryAutoHeight.git#3c5eb1ae8d
{
  name: 'jQueryAutoHeight',
  homepage: 'https://github.com/tinybeans/jQueryAutoHeight'
}
No versions available.

Usage

jQueryの後にライブラリを読み込み、揃えたいセレクタを指定する。

<script src="/vendor/jQueryAutoHeight.js"></script>
<script type="text/javascript">
  jQuery(function($){
    'use strict';
    $('div.item').autoHeight();
  });
</script>

2014-07-17_div-box_02

補遺