baserJSで要素の高さを揃える

コーポレートサイトにちょうどいいJavaScriptライブラリ baserJS の解説記事です。

Webサイトと詳しいAPIリファレンスはこちら baserJS Webサイト

floatさせたブロックなどの高さを揃える

サンプル

JavaScript

// 全ての対象のボックスの高さを揃える
$('.box').bcBoxAlignHeight();

// 対象のボックスを3個ずつ高さを揃える
// ※3カラムのときなど
$('.box').bcBoxAlignHeight(3);

// 複数のグループをまたがるとき
$('.group').bcBoxAlignHeight(3, '.box');

// 各要素の高さを揃える直前で呼び出すコールバック
$('.group').bcBoxAlignHeight(3, null, function (maxHeight, currentHeight, $targets) {
    // falsyな値を返すと高さの調整をキャンセルできる
    retrun false;
});