Unleash awesomeness. Private packages, team management tools, and powerful integrations. Get started with npm Orgs »

resizable

1.2.1 • Public • Published

Resizable

Resizable behaviour for elements. Demo.

npm install resizable

var Resizable = require('resizable');
 
var el = document.querySelector('.my-element');
 
 
var resizable = new Resizable(el, {
    within: 'parent',
    handles: 's, se, e',
    threshold: 10,
    draggable: false
});
 
resizable.on('resize', function(){
    //...
});

Options

Parameter Default Description
handles * List of handles to support. Valid handles: s, se, e, ne, n, nw, w, sw. May be specified as an object, array, or comma-separated string.
resize undefined Resize event handler.
threshold 10 A movement threshold required to start resize - whether array, number or function.
within document Restrict movement within the container. Pass 'parent' to take parent node.
draggable false Make element draggable as well. Set an object to pass options to draggable.
css3 true Use translate3d for defining position.

* Default handles are dependent on the styling of the given element. Inline elements will default to s, se, e, while elements that can support full resize will default to all handles being enabled.

Events

Name Description
resizestart Element resize started. Called on self.
resize Element resized. Called on self.
resizeend Element resize ended. Called on self.

install

npm i resizable

Downloadsweekly downloads

185

version

1.2.1

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability