Nutritious Pumpkin Meal

    element-height-observer
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.9 • Public • Published

    Element height observer

    This library allows you to add an observer for page or element height. Each time the page changes height, a callback will be called.

    No dependencies, total library minified is less than 0.9 KB

    Install

    npm install element-height-observer --save

    Use

    Load the script:

    <html>
        <head>
            <script src="node_modules/element-height-observer/dist/index.js"></script> 
        </head>
    </html>

    Or import it:

    var heightObserver = require('element-height-observer');
    var registerHeightObserver = heightObserver.registerHeightObserver;
    var unregisterHeightObserver = heightObserver.unregisterHeightObserver;

    Or import it (ES6 modules notation):

    import { registerHeightObserver, unregisterHeightObserver } from 'element-height-observer';

    When the page has loaded, you can register the observer like this:

    window.addEventListener('load', function () {
        var someElement = document.querySelector('#someElementId');
        registerHeightObserver(someElement, function () {
            // Your code that you want to execute when the element changes height
        })
    });

    You can only add one listener per element, otherwise the unregister mechanism won't work correctly.

    var someElement = document.querySelector('#someElementId');
    unregisterHeightObserver(someElement);

    API

    There are 2 functions available:

    • registerHeightObserver(elementToWatch, options?, callback)
    • unregisterHeightObserver(elementToStopWatching)

    The options are optional and can currently only specify which dimension of the element it should watch for:

    direction'horizontal' | 'vertical' | 'both'

    The default is 'vertical'

    The callback doesn't get passed any parameters:

    callback: () => void

    Inspiration

    This library is inspired by a stackoverflow post by Jake

    Install

    npm i element-height-observer

    DownloadsWeekly Downloads

    106

    Version

    0.0.9

    License

    MIT

    Unpacked Size

    59.8 kB

    Total Files

    17

    Last publish

    Collaborators

    • bertyhell