-<div xmlns:ext="http://www.extjs.com" class="body-wrap"><div class="inheritance res-block"><pre class="res-block-inner"><a href="output/Ext.util.Observable.html" ext:member="" ext:cls="Ext.util.Observable">Observable</a> <img src="resources/elbow-end.gif">Resizable</pre></div><h1>Class <a href="source/Resizable.html#cls-Ext.Resizable">Ext.Resizable</a></h1><table cellspacing="0"><tr><td class="label">Package:</td><td class="hd-info">Ext</td></tr><tr><td class="label">Defined In:</td><td class="hd-info">Resizable.js</td></tr><tr><td class="label">Class:</td><td class="hd-info"><a href="source/Resizable.html#cls-Ext.Resizable">Resizable</a></td></tr><tr><td class="label">Extends:</td><td class="hd-info"><a href="output/Ext.util.Observable.html" ext:cls="Ext.util.Observable" ext:member="">Observable</a></td></tr></table><div class="description"><p>Applies drag handles to an element to make it resizable. The drag handles are inserted into the element \r
-and positioned absolute. Some elements, such as a textarea or image, don't support this. To overcome that, you can wrap\r
-the textarea in a div and set 'resizeChild' to true (or to the id of the element), <b>or</b> set wrap:true in your config and\r
-the element will be wrapped for you automatically.</p>\r
-<p>Here is the list of valid resize handles:</p>\r
-<pre>\r
-Value Description\r
------- -------------------\r
- 'n' north\r
- 's' south\r
- 'e' east\r
- 'w' west\r
- 'nw' northwest\r
- 'sw' southwest\r
- 'se' southeast\r
- 'ne' northeast\r
- 'all' all\r
-</pre>\r
-<p>Here's an example showing the creation of a typical Resizable:</p>\r
-<pre><code><b>var</b> resizer = <b>new</b> Ext.Resizable(<em>'element-id'</em>, {\r
- handles: <em>'all'</em>,\r
- minWidth: 200,\r
- minHeight: 100,\r
- maxWidth: 500,\r
- maxHeight: 400,\r
- pinned: true\r
-});\r
-resizer.on(<em>'resize'</em>, myHandler);</code></pre>\r
-<p>To hide a particular handle, set its display to none in CSS, or through script:<br>\r
-resizer.east.setDisplayed(false);</p></div><div class="hr"></div><a id="Ext.Resizable-configs"></a><h2>Config Options</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Config Options</th><th class="msource-header">Defined By</th></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-adjustments"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-adjustments">adjustments</a></b> : Array/String<div class="mdesc"><div class="short">String 'auto' or an array [width, height] with values to be added to the
-resize operation's new size (defaults to [0...</div><div class="long">String 'auto' or an array [width, height] with values to be <b>added</b> to the\r
-resize operation's new size (defaults to <tt>[0, 0]</tt>)</div></div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-animate"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-animate">animate</a></b> : Boolean<div class="mdesc">True to animate the resize (not compatible with dynamic sizing, defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-constrainTo"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-constrainTo">constrainTo</a></b> : Mixed<div class="mdesc">Constrain the resize to a particular element</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-disableTrackOver"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-disableTrackOver">disableTrackOver</a></b> : Boolean<div class="mdesc">True to disable mouse tracking. This is only applied at config time. (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-draggable"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-draggable">draggable</a></b> : Boolean<div class="mdesc">Convenience to initialize drag drop (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-duration"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-duration">duration</a></b> : Number<div class="mdesc">Animation duration if animate = true (defaults to 0.35)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-dynamic"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-dynamic">dynamic</a></b> : Boolean<div class="mdesc">True to resize the element while dragging instead of using a proxy (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-easing"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-easing">easing</a></b> : String<div class="mdesc">Animation easing if animate = true (defaults to <tt>'easingOutStrong'</tt>)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-enabled"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-enabled">enabled</a></b> : Boolean<div class="mdesc">False to disable resizing (defaults to true)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-handleCls"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-handleCls">handleCls</a></b> : String<div class="mdesc">A css class to add to each handle. Defaults to <tt>''</tt>.</div></td><td class="msource">Resizable</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-handles"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-handles">handles</a></b> : String<div class="mdesc"><div class="short">String consisting of the resize handles to display (defaults to undefined).
-Specify either 'all' or any of 'n s e w ...</div><div class="long">String consisting of the resize handles to display (defaults to undefined).\r
-Specify either <tt>'all'</tt> or any of <tt>'n s e w ne nw se sw'</tt>.</div></div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-height"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-height">height</a></b> : Number<div class="mdesc">The height of the element in pixels (defaults to null)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-heightIncrement"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-heightIncrement">heightIncrement</a></b> : Number<div class="mdesc">The increment to snap the height resize in pixels\r
+<div class="body-wrap" xmlns:ext="http://www.extjs.com"><div class="top-tools"><a class="inner-link" href="#Ext.Resizable-props"><img src="../resources/images/default/s.gif" class="item-icon icon-prop">Properties</a> <a class="inner-link" href="#Ext.Resizable-methods"><img src="../resources/images/default/s.gif" class="item-icon icon-method">Methods</a> <a class="inner-link" href="#Ext.Resizable-events"><img src="../resources/images/default/s.gif" class="item-icon icon-event">Events</a> <a class="inner-link" href="#Ext.Resizable-configs"><img src="../resources/images/default/s.gif" class="item-icon icon-config">Config Options</a> <a class="bookmark" href="../docs/?class=Ext.Resizable"><img src="../resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a> </div><div class="inheritance res-block"><pre class="res-block-inner"><a href="output/Ext.util.Observable.html" ext:member="" ext:cls="Ext.util.Observable">Observable</a> <img src="resources/elbow-end.gif">Resizable</pre></div><h1>Class <a href="source/Resizable.html#cls-Ext.Resizable">Ext.Resizable</a></h1><table cellspacing="0"><tr><td class="label">Package:</td><td class="hd-info">Ext</td></tr><tr><td class="label">Defined In:</td><td class="hd-info"><a href="source/Resizable.html#cls-Ext.Resizable">Resizable.js</a></td></tr><tr><td class="label">Class:</td><td class="hd-info"><a href="source/Resizable.html#cls-Ext.Resizable">Resizable</a></td></tr><tr><td class="label">Extends:</td><td class="hd-info"><a href="output/Ext.util.Observable.html" ext:cls="Ext.util.Observable" ext:member="">Observable</a></td></tr></table><div class="description"><p>Applies drag handles to an element to make it resizable. The drag handles are inserted into the element
+and positioned absolute. Some elements, such as a textarea or image, don't support this. To overcome that, you can wrap
+the textarea in a div and set 'resizeChild' to true (or to the id of the element), <b>or</b> set wrap:true in your config and
+the element will be wrapped for you automatically.</p>
+<p>Here is the list of valid resize handles:</p>
+<pre>
+Value Description
+------ -------------------
+ 'n' north
+ 's' south
+ 'e' east
+ 'w' west
+ 'nw' northwest
+ 'sw' southwest
+ 'se' southeast
+ 'ne' northeast
+ 'all' all
+</pre>
+<p>Here's an example showing the creation of a typical Resizable:</p>
+<pre><code><b>var</b> resizer = <b>new</b> Ext.Resizable(<em>'element-id'</em>, {
+ handles: <em>'all'</em>,
+ minWidth: 200,
+ minHeight: 100,
+ maxWidth: 500,
+ maxHeight: 400,
+ pinned: true
+});
+resizer.on(<em>'resize'</em>, myHandler);</code></pre>
+<p>To hide a particular handle, set its display to none in CSS, or through script:<br>
+resizer.east.setDisplayed(false);</p></div><div class="hr"></div><a id="Ext.Resizable-configs"></a><h2>Config Options</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Config Options</th><th class="msource-header">Defined By</th></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-adjustments"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-adjustments">adjustments</a></b> : Array/String<div class="mdesc"><div class="short">String 'auto' or an array [width, height] with values to be added to the
+resize operation's new size (defaults to [0,...</div><div class="long">String 'auto' or an array [width, height] with values to be <b>added</b> to the
+resize operation's new size (defaults to <tt>[0, 0]</tt>)</div></div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-animate"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-animate">animate</a></b> : Boolean<div class="mdesc">True to animate the resize (not compatible with dynamic sizing, defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-constrainTo"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-constrainTo">constrainTo</a></b> : Mixed<div class="mdesc">Constrain the resize to a particular element</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-disableTrackOver"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-disableTrackOver">disableTrackOver</a></b> : Boolean<div class="mdesc">True to disable mouse tracking. This is only applied at config time. (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-draggable"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-draggable">draggable</a></b> : Boolean<div class="mdesc">Convenience to initialize drag drop (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-duration"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-duration">duration</a></b> : Number<div class="mdesc">Animation duration if animate = true (defaults to 0.35)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-dynamic"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-dynamic">dynamic</a></b> : Boolean<div class="mdesc">True to resize the element while dragging instead of using a proxy (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-easing"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-easing">easing</a></b> : String<div class="mdesc">Animation easing if animate = true (defaults to <tt>'easingOutStrong'</tt>)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-enabled"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-enabled">enabled</a></b> : Boolean<div class="mdesc">False to disable resizing (defaults to true)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-handleCls"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-handleCls">handleCls</a></b> : String<div class="mdesc">A css class to add to each handle. Defaults to <tt>''</tt>.</div></td><td class="msource">Resizable</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-handles"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-handles">handles</a></b> : String<div class="mdesc"><div class="short">String consisting of the resize handles to display (defaults to undefined).
+Specify either 'all' or any of 'n s e w n...</div><div class="long">String consisting of the resize handles to display (defaults to undefined).
+Specify either <tt>'all'</tt> or any of <tt>'n s e w ne nw se sw'</tt>.</div></div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-height"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-height">height</a></b> : Number<div class="mdesc">The height of the element in pixels (defaults to null)</div></td><td class="msource">Resizable</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Resizable-heightIncrement"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-heightIncrement">heightIncrement</a></b> : Number<div class="mdesc">The increment to snap the height resize in pixels
git.ithinksw.org / extjs.git / blobdiff