- Notifications
You must be signed in to change notification settings - Fork23
🌿 1Kb DOM element size sensor which will callback when size changed.
hustcc/size-sensor
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
DOM element size sensor which will callback when the element size changed.
DOM 元素尺寸监听器，当元素尺寸变化的时候，将会触发回调函数！
- rc-size-sensor: React component wrapper.
npm i --save size-sensor
Then import it.
import{bind,clear}from'size-sensor';
or import it byscript in HTML, then getsizeSensor on window.
<scriptsrc="https://unpkg.com/size-sensor/dist/size-sensor.min.js"></script>
- bind & unbind
import{bind,clear}from'size-sensor';// bind the event on element, will get the `unbind` functionconstunbind1=bind(document.querySelector('.container'),element=>{// do what you want to to.});constunbind2=bind(document.querySelector('.container'),element=>{// do what you want to to.});// if you want to cancel bind event.unbind1();
- clear
import{bind,clear}from'size-sensor';/* * // bind the resize event. * const unbind1 = bind(...); * const unbind2 = bind(...); * ... */// you can cancel all the event of element.clear(element);
There is only 2 API:
- bind(element, callback)
Bind the resize trigger function on element. The function will returnunbind function.
- clear(element)
Clear all the object and resize event on element.
The size sensor strategies include:
ResizeObserver: useresizeObserver to observe element's size.object: useobject document's resize event.
IfResizeObserver exists, use it, else useobject as default.
Online demo clickhere. Used By:
ISC@hustcc.
About
🌿 1Kb DOM element size sensor which will callback when size changed.
Topics
Resources
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Uh oh!
There was an error while loading.Please reload this page.