storm-equal-height

    1.0.4 • Public • Published

    Storm Equal Height

    Build Status codecov.io npm version

    Layout helper to equalise the height of a set of DOM elements. This is a last resort after CSS grid, flexbox, display:table, and min-heights have been discounted. If the elements contain asynchronously loaded assets, including imgs, you will need to inti this compononet after they have loaded.

    Example

    https://mjbp.github.io/storm-equal-height

    Usage

    HTML

    <div class="js-equal-height">
        <div>
            ...
        </div>
        <div>
            ...
        </div>
        <div>
            ...
        </div>
    </div>
    

    JS

    npm i -S storm-equal-height
    

    either using es6 import

    import EqualHeight from 'storm-equal-height';
    
    EqualHeight.init('.js-equal-height');
    

    aynchronous browser loading (use the .standalone version in the /dist folder)

    import Load from 'storm-load';
    
    Load('/content/js/async/storm-equal-height.standalone.js')
        .then(() => {
            StormEqualHeight.init('.js-equal-height');
        });
    

    Options

        {
            minWidth: 768 
        }
    

    e.g.

    EqualHeight.init('.js-equal-height');
    

    Tests

    npm run test
    

    Browser support

    This is module has both es6 and es5 distributions. The es6 version should be used in a workflow that transpiles.

    This module depends upon Object.assign, element.classList, and Promises, available in all evergreen browsers. ie9+ is supported with polyfills, ie8+ will work with even more polyfills for Array functions and eventListeners.

    Dependencies

    None external.

    Imports lodash.throttle.

    License

    MIT

    Install

    npm i storm-equal-height

    DownloadsWeekly Downloads

    5

    Version

    1.0.4

    License

    MIT

    Unpacked Size

    60.9 kB

    Total Files

    16

    Last publish

    Collaborators

    • mjbp