Simple jQuery Plugin To Equalize Heights of Elements - equalizeHeight

File Size: 6.97 KB
Views Total: 867
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Simple jQuery Plugin To Equalize Heights of Elements - equalizeHeight

A small, responsive and customizable jQuery equal height plugin which allows you to set a group of content blocks to the same height.

How to use it:

1. Load the JavaScript file jquery.equal.height.js after jQuery library, but before the closing body tag.

<script src="/path/to/jquery.min.js"></script>
<script src="/path/to/jquery.equal.height.js"></script>

2. Call the function on desired elements.

$('.equalize').equalizeHeight({
  selector: '.equalcol'
});

3. There are several options which can be passed to equalizeHeight() as an object:

  • selector: '.equalcol': Selector (string) to equalize: 
  • byrow: true: Set if the columns should be equalized by rows. If true, each row of elements will have its own height. If false, the tallest column will give its height to all others
  • breakpoint: 767: Point at which the equalizing should stop

This awesome jQuery plugin is developed by scriptex. For more Advanced Usages, please check the demo page or visit the official website.