<script>
$(document).ready(function() {
$( "#resize_id" ).resizable();
})
</script>
Resizable DEMO with full code
alsoResize ^ |
---|
Type : Selector or element Default : false Along with main resizable Element, another element will resize.
DEMO of alsoResize To read alsoResizable
To set alsoResizable ( sel is the variable )
DEMO of alsoResize with get set
|
animate ^ |
Type : Boolean Default : false After resizing to animate or not to reach final size.
DEMO of animate
To read animate
To set animate ( sel is the variable )
DEMO of animate get set
|
animateDuration ^ |
Type : Number or String Default : 'slow' Duration of animation as string ( 'slow' or 'fast' ) or number ( duration in milliseconds )
DEMO of animateDuration
To read animateDuration
To set animate ( sel is the variable )
|
animateEasing ^ |
Type : String Default : 'swing', Full list of easing options is here. animageEasing we can set to different values from this list.
DEMO of animateEasing
To read animateEasing
To set animate ( sel is the variable )
|
aspectRatio^ |
Type : Boolean or Number Default : false The aspect ratio to be maintained ( or not ) for the element .
DEMO of aspectRatio
To read aspectRaion option
To set aspectRatio option ( sel is the variable )
|
autoHide^ |
Type : Boolean Default : false The handles for changing size should be visible or not when the mouse is not hovering over the element.
DEMO of autoHide option
To read autoHide option
To set autoHide option ( sel is the variable )
|
cancel^ |
Type : Selector Default : 'input,textarea, button, select' Prevent the element from resizing.
DEMO of cancel option with get and set
To read cancel option
To set cancel option ( sel is the variable )
|
classes^ |
Type : Object Default : { "ui-resizable-se": "ui-icon ui-icon-gripsmall-diagonal-se" }
To read classes option
To set classes option ( sel is the variable )
DEMO of classes option with get and set
|
containment^ |
Type : Selector or element or string Default : false
To read containment option
To set containment option ( sel is the variable )
DEMO of containment option with get and set
|
disabled^ |
Type : Boolean ( True or False) Default : false
To read disabled option
To set disabled option ( sel is the variable )
DEMO of disabled option with getting the value and setting the value
|
ghost^ |
Type : Boolean ( True or False) Default : false semi transparent helper element is shown while resizing if it is set to true
To read ghost option
To set ghost option ( sel is the variable )
DEMO of ghost option with getting the value and setting the value
|
grid^ |
Type : Array Default : false While resizing, the element will get snapped to the input grid of given pixels.
To read grid option
To set grid option ( sel is the variable )
DEMO of grid option with getting the value and setting the value
|
handles^ |
![]() Type : string or object Default : 'e,s,se' While resizing, the handles should appear in which sides. It can be north, south, south east ... etc. Check the demo below.
To read handles option
To set handler option ( sel is the variable )
DEMO of handles option with getting the value and setting the value
|
helper^ |
Type : String Default : false While resizing a different class will be added to a proxy element and displayed. This is shown till the resizing is completed.
To read helper option
To set helper option ( sel is the variable )
DEMO of helper option with getting the value and setting the value
|
maxHeight^ |
Type : number Default : null Maximum height upto which resizing is allowed.
To read maxHeight option
To set maxHeight option ( sel is the variable )
DEMO of maxHeight option with getting the value and setting the value
|
maxWidth^ |
Type : number Default : null Maximum width upto which resizing is allowed.
To read maxWidth option
To set maxWidth option ( sel is the variable )
DEMO of maxWidth option with getting the value and setting the value
|
minHeight^ |
Type : number Default : null Minimum height upto which resizing is allowed.
To read minHeight option
To set minHeight option ( sel is the variable )
DEMO of minHeight option with getting the value and setting the value
|
minWidth^ |
Type : number Default : null Manimum width upto which resizing is allowed.
To read minWidth option
To set minWidth option ( sel is the variable )
DEMO of minWidth option with getting the value and setting the value
|
methods^ |
destroy^ |
Removes the functionality from the resizable element. No input arguments for this method.
DEMO of destroy method
|
disable^ |
Disables the resizable element.
DEMO of disable enable methods
|
enable^ |
Enables the resizable element.
DEMO of disable enable methods
|
instance^ |
Retrives resizable element.
|
Most Popular JQuery Scripts | |
1 | Two dependant list boxes |
2 | Calendar with Date Selection |
3 | Data change by Slider |
4 | Show & Hide element |