baserJSで要素の高さを揃える

  • 0
    いいね
  • 0
    コメント
    この記事は最終更新日から1年以上が経過しています。

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

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

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

    サンプル

    http://codepen.io/YusukeHirao/pen/yyOJXP

    JavaScript

    // 全ての対象のボックスの高さを揃える
    $('.box').bcBoxAlignHeight();
    
    // 対象のボックスを3個ずつ高さを揃える
    // ※3カラムのときなど
    $('.box').bcBoxAlignHeight(3);
    
    // 複数のグループをまたがるとき
    $('.group').bcBoxAlignHeight(3, '.box');
    
    // 各要素の高さを揃える直前で呼び出すコールバック
    $('.group').bcBoxAlignHeight(3, null, function (maxHeight, currentHeight, $targets) {
        // falsyな値を返すと高さの調整をキャンセルできる
        retrun false;
    });