Skip to content
master
Switch branches/tags
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 

README.md

eqheights

Give all elements in a group of elements at least the height of the tallest element of the group.

Install

Find eqheights on npm

npm i eqheights

Usage Examples

Simplest, one off:

import eqheights from 'eqheights';

// using a selector string
eqheights('.grid-items');

// or using a NodeList
const elements = document.querySelectorAll('.list-items');

eqheights(elements);

Responsive:

import eqheights from 'eqheights';

const gridEqualizer = eqheights('.grid-items');
window.addEventListener('resize', gridEqualizer.recalc);

Togglable:

import eqheights from 'eqheights';

// autorun = false because we
// want to initialize only,
// not run eqheights yet
const {recalc, clear} = eqheights('.grid-items', {autorun: false});

const container = document.getElementById('grid');
document
  .getElementById('toggle')
  .addEventListener('click', () => {
    Array.prototype.indexOf(container.classList, 'active') < 0
      ? recalc()
      : clear();

    container.classList.toggle('active');
  });

Togglable and Responsive:

See this codepen: http://codepen.io/Maximilianos/pen/OyBYvv?editors=001

License

MIT © Max GJ Panas

About

Give all elements in a group of elements at least the height of the tallest element of the group

Resources

Packages

No packages published