https://github.com/shama/resize-event

Detect resize on an element without polling or iframes
https://github.com/shama/resize-event

dom element resize

Last synced: about 2 months ago
JSON representation

Detect resize on an element without polling or iframes

• Host: GitHub
• URL: https://github.com/shama/resize-event
• Owner: shama
• Created: 2015-07-23T01:04:54.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2023-07-24T22:33:13.000Z (about 1 year ago)
• Last Synced: 2024-07-22T05:34:33.864Z (2 months ago)
• Topics: dom, element, resize
• Language: JavaScript
• Size: 10.7 KB
• Stars: 22
• Watchers: 3
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# resize-event

Detect resize on an element without polling or iframes

[![build status](https://secure.travis-ci.org/shama/resize-event.svg)](https://travis-ci.org/shama/resize-event)

[![NPM version](https://badge.fury.io/js/resize-event.svg)](https://badge.fury.io/js/resize-event)

If the browser supports [`ResizeObserver`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver) this will use that otherwise it will fallback to a [MutationObserver](https://developer.mozilla.org/en-US/docs/Web/API/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

```js

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

```shell

npm install resize-event --save

```

# license

(c) 2020 Kyle Robinson Young. MIT License