1.0.1 • Published 2 years ago

@andybeersdev/aurelia-resize v1.0.1

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

@andybeersdev/aurelia-resize

forking of aurelia-resize in order to gain access to a custom version of element-resize-detector

an aurelia attribute add-on that detects DOM-element resize events either via window-change or CSS-animation.

example

view:

<window>
  <div style="background-color:#6bb329" resizeable resize.trigger="onContentResize($event.detail)"></div>
  <h2>width: ${width}</h2>
  <h2>height: ${height}</h2>
</window>

view-model:

onContentResize(x) {
  this.width = x.width;
  this.height = x.height;
}

Dependencies

This plugin is a smaller wrapper around @andybeersdev/element-resize-detector.

Caveats:

  • If the element has position: static it will be changed to position: relative. Any unintentional top/right/bottom/left/z-index styles will therefore be applied and absolute positioned children will be positioned relative to the element.
  • A hidden element will be injected as a direct child to the element.

Install (Aurelia CLI)

Install with npm:

npm install @andybeersdev/aurelia-resize --save