jQuery Plugin To Make Equal Height Columns - jcolumn

jcolumn is an ultra-light jQuery plugin for making a group of columns height equal to the tallest one that works on window resize event.

How to use it:

1. Include the jcolumn.js script after jQuery JavaScript library.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jColumn.js"></script>

2. Add a group of block elements into a container.

<div class="row">
  <div class="col">
    <p> ... </p>
  </div>
  <div class="col">
    <p> ... </p>
  </div>
  <div class="col">
    <p> ... </p>
  </div>
</div>

3. Initialize the plugin by calling the function on the columns.

$('.col').jcolumn();

4. Possible plugin options.

// The delayed time after the resize happens
delay: 500,

// Every document width smaller than maxWidth will not use jcolumn
maxWidth: 767,

// A callaback function which gets triggered after resize
callback: null,

// Disable resize event.
resize: true

Change log:

2016-05-22

• v1.0.0

2015-10-27

• minor fixes

2015-10-16

• minor fixes

2015-08-15

• noop function implemented

2015-08-06

• prevent resize via option

---

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