Responsive Equal Height Plugin In Pure JavaScript – Responsive AutoHeight

Preview:

Description:

Yet another equal height plugin written in pure JavaScript that automatically equalizes the height of blocks/columns in your responsive web layout.

How to use it:

Install the Responsive AutoHeight with package managers.

# Yarn
$ yarn add responsive-auto-height
# NPM
$ npm install responsive-auto-height --save

Import the Responsive AutoHeight.

import ResponsiveAutoHeight from 'responsive-auto-height';

Add the class ‘js-auto-height’ to content blocks as follows:

<div class="row">
  <div class="col-md-4">
    <div class="js-auto-height">
      Content 1
    </div>
  </div>
  <div class="col-md-4">
    <div class="js-auto-height">
      Content 2
  </div>
  ...
</div>

Initialize the library and done.

new ResponsiveAutoHeight('.js-auto-height');

Changelog:

v0.0.5 (02/27/2020)

• feat: accept nodelist