Nashville Plays Music

    delay-image

    3.0.0 • Public • Published

    delay-image

    Build Status BrowserStack Status

    Delay image load until it’s in viewport.

    Install

    npm install delay-image --save

    Usage

    By default, it will look for data-src attribute on image element and add src attribute when image has been successfully loaded.

    <img id="jackie" data-src="jackie.jpg" />
    import delayImage from 'delay-image';
    
    delayImage(document.querySelector('#jackie'), {
    	onEnter: (element) => {
    		// Image in viewport!
    	}
    });

    API

    delayImage(element, options)

    Delay image load until it’s in viewport.

    element

    Type: Element

    Image element.

    options

    Type: Object

    Property Type Default value Description
    threshold number 0 Positive value in pixels which will signal plugin to check for image presence earlier in document.
    scrollResizeHandler Function 300 Window scroll and resize event handler. Useful if you want to use throttle or debounce methods on those events. Should return new handler (original or wrapped).
    imageSource string element.getAttribute('data-src') Image URL to load.
    onEnter Function () => {} Callback to execute if image is within viewport (useful for loader initialization).
    onSuccess Function (element) => { element.src = imageSource; } Callback to execute if image has been successfully loaded. If you define this callback, you need to add src attribute yourself.
    onFail Function () => { ... } Callback to execute if image has failed to load.

    instance.destroy()

    Destroy instance.

    Browser support

    Tested in Edge 15, Chrome 72 and Firefox 65, and should work in all modern browsers (support based on Browserslist configuration).

    Test

    For automated tests, run npm run test:automated (append :watch for watcher support).

    License

    MIT © Ivan Nikolić

    Install

    npm i delay-image

    DownloadsWeekly Downloads

    560

    Version

    3.0.0

    License

    MIT

    Unpacked Size

    13.3 kB

    Total Files

    7

    Last publish

    Collaborators

    • niksy