Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

resize-event

2.0.0 • Public • Published

resize-event

Detect resize on an element without polling or iframes

build status NPM version

If the browser supports ResizeObserver this will use that otherwise it will fallback to a MutationObserver to detect changes to the style attribute of an element and then compares the width/height to check if it has changed.

A polyfill is provided for MutationObserver which will then use polling on really old browsers.

usage

import onresize from "resize-event"
 
// Create or select an element, must be in the DOM
const element = document.createElement('div')
document.body.appendChild(element)
 
// Bind the event
const observer = onResize(element, () => {
  console.log('element was resized', element.offsetWidth, element.offsetHeight)
})
 
// Trigger the event
element.style.width = '500px'
 
// Later disconnect the event
observer.disconnect()

install

npm install resize-event --save

license

(c) 2020 Kyle Robinson Young. MIT License

Install

npm i resize-event

DownloadsWeekly Downloads

96

Version

2.0.0

License

MIT

Unpacked Size

5.39 kB

Total Files

7

Last publish

Collaborators

  • avatar