Option | Description | Example |
alsoResize | It define that One or more elements to resize synchronously with the resizable element. | $("#res1").resizable({ alsoResize:"#res2" }); |
animate | Define animates to the final size after resizing. | $("#res1").resizable({ animate: true }); |
animateDuration | Define the time in which animation will complete. This option is used only when animate option is true. By default its value is "slow". | $("#res1").resizable({ animateDuration: "slow" }); |
animateEasing | Define which easing to apply when using the animate option. By default its value is "swing". | $("#res1").resizable({ animate:true, animateDuration: "slow", animateEasing: "easeOutBounce" }); |
aspectRatio | Define that whether to keep the aspect (height and width) ratio for the item. By default its value is false. | $("#res1").resizable({ animate:true, aspectRatio:true }); |
autoHide | It is used to hide the magnification icon or handles. It will appear when the mouse is over the item. By default its value is false. | $("#res1").resizable({ autoHide: true }); |
cancel | Prevents resizing from starting on specified elements. By default its value is input, textarea, button , select , option | $("#res1").resizable({ cancel: "#text" }); |
containment | Constrains resizing to within the bounds of the specified element or region. | $("#res1").resizable({ containment: "parent" }); |
delay | Define time in milliseconds to start the resizing. It specified that resizing will not start until after mouse is moved beyond duration. | $("#res1").resizable({ delay:200 }); |
disabled | Disabled the resizable by define true. | $("#res1").resizable({ disabled: true }); |
distance | It specified that resizing will not start until after mouse is moved beyond distance. | $("#res1").resizable({ distance: 30 }); |
ghost | Define a semi-transparent helper element is shown for resizing. | $("#res1").resizable({ ghost: true }); |
grid | Snaps the resizing element to a grid, every x and y pixels using array [x,y] | $("#res1").resizable({ grid: [20, 10] }); |
handles | This option is a character string indicating which sides or angles of the element can be resized. A comma delimited list of any of the following: n, e, s, w, ne, se, sw, nw, all | $("#res1").resizable({ handles: { 'ne': '#negrip', 'se': '#segrip', 'sw': '#swgrip', 'nw': '#nwgrip' } }); |
maxHeight | The maximum height the resizable should be allowed to resize to. Default value is null. | $("#res1").resizable({ maxHeight:420 }); |
maxWidth | The maximum width the resizable should be allowed to resize to. Default value is null. | $("#res1").resizable({ maxWidth:420 }); |
minHeight | The minimum width the resizable should be allowed to resize to. Default value is 10. | $("#res1").resizable({ minHeight:120 }); |
minWidth | The minimum width the resizable should be allowed to resize to. Default value is 10. | $("#res1").resizable({ minWidth:120 }); |