Upgrade to ExtJS 3.2.1 - Released 04/27/2010
[extjs.git] / docs / output / Ext.Resizable.html
index 1b186fc..02ce017 100644 (file)
@@ -1,37 +1,37 @@
-<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>&#13;<a class="inner-link" href="#Ext.Resizable-methods"><img src="resources/images/default/s.gif" class="item-icon icon-method">Methods</a>&#13;<a class="inner-link" href="#Ext.Resizable-events"><img src="resources/images/default/s.gif" class="item-icon icon-event">Events</a>&#13;<a class="inner-link" href="#Ext.Resizable-configs"><img src="resources/images/default/s.gif" class="item-icon icon-config">Config Options</a>&#13;<a class="bookmark" href="../docs/?class=Ext.Resizable"><img src="resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a>&#13;</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>&#13;&nbsp;&nbsp;<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">&nbsp;</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&#13;
-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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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 expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</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).&#13;
-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">&nbsp;</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">&nbsp;</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>&#13;<a class="inner-link" href="#Ext.Resizable-methods"><img src="../resources/images/default/s.gif" class="item-icon icon-method">Methods</a>&#13;<a class="inner-link" href="#Ext.Resizable-events"><img src="../resources/images/default/s.gif" class="item-icon icon-event">Events</a>&#13;<a class="inner-link" href="#Ext.Resizable-configs"><img src="../resources/images/default/s.gif" class="item-icon icon-config">Config Options</a>&#13;<a class="bookmark" href="../docs/?class=Ext.Resizable"><img src="../resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a>&#13;</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>&#13;&nbsp;&nbsp;<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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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">&nbsp;</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
 (only applies if <code><a href="output/Ext.Resizable.html#Ext.Resizable-dynamic" ext:member="dynamic" ext:cls="Ext.Resizable">dynamic</a>==true</code>). Defaults to <tt>0</tt>.</div></td><td class="msource">Resizable</td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-listeners"></a><b><a href="source/Observable.html#cfg-Ext.util.Observable-listeners">listeners</a></b> : Object<div class="mdesc"><div class="short">A config object containing one or more event handlers to be added to this
 object during initialization.  This should ...</div><div class="long"><p>A config object containing one or more event handlers to be added to this
 object during initialization.  This should be a valid listeners config object as specified in the
@@ -87,19 +87,21 @@ Ext.DomObserver = Ext.extend(Object, {
     typeAhead: true,
     mode: <em>'local'</em>,
     triggerAction: <em>'all'</em>
-});</code></pre></p></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#listeners" ext:member="#listeners" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-maxHeight"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-maxHeight">maxHeight</a></b> : Number<div class="mdesc">The maximum height for the element (defaults to 10000)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-maxWidth"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-maxWidth">maxWidth</a></b> : Number<div class="mdesc">The maximum width for the element (defaults to 10000)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minHeight"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minHeight">minHeight</a></b> : Number<div class="mdesc">The minimum height for the element (defaults to 5)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minWidth"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minWidth">minWidth</a></b> : Number<div class="mdesc">The minimum width for the element (defaults to 5)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minX"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minX">minX</a></b> : Number<div class="mdesc">The minimum x for the element (defaults to 0)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minY"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minY">minY</a></b> : Number<div class="mdesc">The minimum x for the element (defaults to 0)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-multiDirectional"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-multiDirectional">multiDirectional</a></b> : Boolean<div class="mdesc"><b>Deprecated</b>.  Deprecated style of adding multi-direction resize handles.</div></td><td class="msource">Resizable</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-pinned"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-pinned">pinned</a></b> : Boolean<div class="mdesc"><div class="short">True to ensure that the resize handles are always visible, false to display them only when the&#13;
-user mouses over the ...</div><div class="long">True to ensure that the resize handles are always visible, false to display them only when the\r
-user mouses over the resizable borders. This is only applied at config time. (defaults to false)</div></div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-preserveRatio"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-preserveRatio">preserveRatio</a></b> : Boolean<div class="mdesc">True to preserve the original ratio between height\r
-and width during resize (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-resizeChild"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-resizeChild">resizeChild</a></b> : Boolean/String/Element<div class="mdesc">True to resize the first child, or id/element to resize (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-resizeRegion"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-resizeRegion">resizeRegion</a></b> : Ext.lib.Region<div class="mdesc">Constrain the resize to a particular region</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-transparent"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-transparent">transparent</a></b> : Boolean<div class="mdesc">True for transparent handles. 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">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-width"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-width">width</a></b> : Number<div class="mdesc">The width 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">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-widthIncrement"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-widthIncrement">widthIncrement</a></b> : Number<div class="mdesc">The increment to snap the width resize in pixels\r
-(only applies if <code><a href="output/Ext.Resizable.html#Ext.Resizable-dynamic" ext:member="dynamic" ext:cls="Ext.Resizable">dynamic</a>==true</code>). Defaults to <tt>0</tt>.</div></td><td class="msource">Resizable</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-wrap"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-wrap">wrap</a></b> : Boolean<div class="mdesc"><div class="short">True to wrap an element with a div if needed (required for textareas and images, defaults to false)&#13;
-in favor of the ...</div><div class="long">True to wrap an element with a div if needed (required for textareas and images, defaults to false)\r
-in favor of the handles config option (defaults to false)</div></div></td><td class="msource">Resizable</td></tr></tbody></table><a id="Ext.Resizable-props"></a><h2>Public Properties</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Property</th><th class="msource-header">Defined By</th></tr><tr class="property-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-enabled"></a><b><a href="source/Resizable.html#prop-Ext.Resizable-enabled">enabled</a></b> : Boolean<div class="mdesc">Writable. False if resizing is disabled.</div></td><td class="msource">Resizable</td></tr><tr class="property-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-proxy"></a><b><a href="source/Resizable.html#prop-Ext.Resizable-proxy">proxy</a></b> : Ext.Element.<div class="mdesc"><div class="short">The proxy Element that is resized in place of the real Element during the resize operation.&#13;
-This may be queried usin...</div><div class="long">The proxy Element that is resized in place of the real Element during the resize operation.\r
-This may be queried using <a href="output/Ext.Element.html#Ext.Element-getBox" ext:member="getBox" ext:cls="Ext.Element">Ext.Element.getBox</a> to provide the new area to resize to.\r
+});</code></pre></p></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#listeners" ext:member="#listeners" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-maxHeight"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-maxHeight">maxHeight</a></b> : Number<div class="mdesc">The maximum height for the element (defaults to 10000)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-maxWidth"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-maxWidth">maxWidth</a></b> : Number<div class="mdesc">The maximum width for the element (defaults to 10000)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minHeight"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minHeight">minHeight</a></b> : Number<div class="mdesc">The minimum height for the element (defaults to 5)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minWidth"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minWidth">minWidth</a></b> : Number<div class="mdesc">The minimum width for the element (defaults to 5)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minX"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minX">minX</a></b> : Number<div class="mdesc">The minimum x for the element (defaults to 0)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-minY"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-minY">minY</a></b> : Number<div class="mdesc">The minimum x for the element (defaults to 0)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-multiDirectional"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-multiDirectional">multiDirectional</a></b> : Boolean<div class="mdesc"><b>Deprecated</b>.  Deprecated style of adding multi-direction resize handles.</div></td><td class="msource">Resizable</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-pinned"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-pinned">pinned</a></b> : Boolean<div class="mdesc"><div class="short">True to ensure that the resize handles are always visible, false to display them only when the
+user mouses over the r...</div><div class="long">True to ensure that the resize handles are always visible, false to display them only when the
+user mouses over the resizable borders. This is only applied at config time. (defaults to false)</div></div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-preserveRatio"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-preserveRatio">preserveRatio</a></b> : Boolean<div class="mdesc">True to preserve the original ratio between height
+and width during resize (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-resizeChild"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-resizeChild">resizeChild</a></b> : Boolean/String/Element<div class="mdesc">True to resize the first child, or id/element to resize (defaults to false)</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-resizeRegion"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-resizeRegion">resizeRegion</a></b> : Ext.lib.Region<div class="mdesc">Constrain the resize to a particular region</div></td><td class="msource">Resizable</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-transparent"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-transparent">transparent</a></b> : Boolean<div class="mdesc">True for transparent handles. 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">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-width"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-width">width</a></b> : Number<div class="mdesc">The width 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">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-widthIncrement"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-widthIncrement">widthIncrement</a></b> : Number<div class="mdesc">The increment to snap the width resize in pixels
+(only applies if <code><a href="output/Ext.Resizable.html#Ext.Resizable-dynamic" ext:member="dynamic" ext:cls="Ext.Resizable">dynamic</a>==true</code>). Defaults to <tt>0</tt>.</div></td><td class="msource">Resizable</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-wrap"></a><b><a href="source/Resizable.html#cfg-Ext.Resizable-wrap">wrap</a></b> : Boolean<div class="mdesc"><div class="short">True to wrap an element with a div if needed (required for textareas and images, defaults to false)
+in favor of the h...</div><div class="long">True to wrap an element with a div if needed (required for textareas and images, defaults to false)
+in favor of the handles config option (defaults to false)</div></div></td><td class="msource">Resizable</td></tr></tbody></table><a id="Ext.Resizable-props"></a><h2>Public Properties</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Property</th><th class="msource-header">Defined By</th></tr><tr class="property-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-enabled"></a><b><a href="source/Resizable.html#prop-Ext.Resizable-enabled">enabled</a></b> : Boolean<div class="mdesc">Writable. False if resizing is disabled.</div></td><td class="msource">Resizable</td></tr><tr class="property-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-proxy"></a><b><a href="source/Resizable.html#prop-Ext.Resizable-proxy">proxy</a></b> : Ext.Element.<div class="mdesc"><div class="short">The proxy Element that is resized in place of the real Element during the resize operation.
+This may be queried using...</div><div class="long">The proxy Element that is resized in place of the real Element during the resize operation.
+This may be queried using <a href="output/Ext.Element.html#Ext.Element-getBox" ext:member="getBox" ext:cls="Ext.Element">Ext.Element.getBox</a> to provide the new area to resize to.
 Read only.</div></div></td><td class="msource">Resizable</td></tr></tbody></table><a id="Ext.Resizable-methods"></a><h2>Public Methods</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Method</th><th class="msource-header">Defined By</th></tr><tr class="method-row expandable"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-Resizable"></a><b><a href="source/Resizable.html#cls-Ext.Resizable">Resizable</a></b>(&nbsp;<code>Mixed&nbsp;el</code>,&nbsp;<code>Object&nbsp;config</code>&nbsp;)
-    <div class="mdesc"><div class="short">Create a new resizable component</div><div class="long">Create a new resizable component<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : Mixed<div class="sub-desc">The id or element to resize</div></li><li><code>config</code> : Object<div class="sub-desc">configuration options</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Resizable</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-addEvents"></a><b><a href="source/Observable.html#method-Ext.util.Observable-addEvents">addEvents</a></b>(&nbsp;<code>Object&nbsp;object</code>&nbsp;)
+    <div class="mdesc"><div class="short">Create a new resizable component</div><div class="long">Create a new resizable component<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : Mixed<div class="sub-desc">The id or element to resize</div></li><li><code>config</code> : Object<div class="sub-desc">configuration options</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Resizable</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-addEvents"></a><b><a href="source/Observable.html#method-Ext.util.Observable-addEvents">addEvents</a></b>(&nbsp;<code>Object|String&nbsp;o</code>,&nbsp;<code>string&nbsp;Optional.</code>&nbsp;)
     :
-                                        void<div class="mdesc"><div class="short">Used to define events on this Observable</div><div class="long">Used to define events on this Observable<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>object</code> : Object<div class="sub-desc">The object with the events defined</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#addEvents" ext:member="#addEvents" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-addListener"></a><b><a href="source/Observable.html#method-Ext.util.Observable-addListener">addListener</a></b>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Function&nbsp;handler</code>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;scope</code>]</span>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;options</code>]</span>&nbsp;)
+                                        void<div class="mdesc"><div class="short">Adds the specified events to the list of events which this Observable may fire.</div><div class="long">Adds the specified events to the list of events which this Observable may fire.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>o</code> : Object|String<div class="sub-desc">Either an object with event names as properties with a value of <code>true</code>
+or the first event name string if multiple event names are being passed as separate parameters.</div></li><li><code>Optional.</code> : string<div class="sub-desc">Event name if multiple event names are being passed as separate parameters.
+Usage:<pre><code>this.addEvents(<em>'storeloaded'</em>, <em>'storecleared'</em>);</code></pre></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#addEvents" ext:member="#addEvents" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-addListener"></a><b><a href="source/Observable.html#method-Ext.util.Observable-addListener">addListener</a></b>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Function&nbsp;handler</code>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;scope</code>]</span>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;options</code>]</span>&nbsp;)
     :
                                         void<div class="mdesc"><div class="short">Appends an event handler to this object.</div><div class="long">Appends an event handler to this object.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The name of the event to listen for.</div></li><li><code>handler</code> : Function<div class="sub-desc">The method the event invokes.</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
 <b>If omitted, defaults to the object which fired the event.</b></div></li><li><code>options</code> : Object<div class="sub-desc">(optional) An object containing handler configuration.
@@ -120,8 +122,8 @@ Using the options argument, it is possible to combine different types of listene
 <br>
 A delayed, one-time listener.
 <pre><code>myDataView.on(<em>'click'</em>, this.onClick, this, {
-    single: true,
-    delay: 100
+single: true,
+delay: 100
 });</code></pre>
 <p>
 <b>Attaching multiple handlers in 1 call</b><br>
@@ -129,34 +131,66 @@ The method also allows for a single argument to be passed which is a config obje
 which specify multiple handlers.
 <p>
 <pre><code>myGridPanel.on({
-    <em>'click'</em> : {
-        fn: this.onClick,
-        scope: this,
-        delay: 100
-    },
-    <em>'mouseover'</em> : {
-        fn: this.onMouseOver,
-        scope: this
-    },
-    <em>'mouseout'</em> : {
-        fn: this.onMouseOut,
-        scope: this
-    }
+<em>'click'</em> : {
+    fn: this.onClick,
+    scope: this,
+    delay: 100
+},
+<em>'mouseover'</em> : {
+    fn: this.onMouseOver,
+    scope: this
+},
+<em>'mouseout'</em> : {
+    fn: this.onMouseOut,
+    scope: this
+}
 });</code></pre>
 <p>
 Or a shorthand syntax:<br>
 <pre><code>myGridPanel.on({
-    <em>'click'</em> : this.onClick,
-    <em>'mouseover'</em> : this.onMouseOver,
-    <em>'mouseout'</em> : this.onMouseOut,
    scope: this
+<em>'click'</em> : this.onClick,
+<em>'mouseover'</em> : this.onMouseOver,
+<em>'mouseout'</em> : this.onMouseOut,
+ scope: this
 });</code></pre></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#addListener" ext:member="#addListener" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-destroy"></a><b><a href="source/Resizable.html#method-Ext.Resizable-destroy">destroy</a></b>(&nbsp;<span title="Optional" class="optional">[<code>Boolean&nbsp;removeEl</code>]</span>&nbsp;)
     :
-                                        void<div class="mdesc"><div class="short">Destroys this resizable. If the element was wrapped and &#13;
-removeEl is not true then the element remains.</div><div class="long">Destroys this resizable. If the element was wrapped and \r
-removeEl is not true then the element remains.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>removeEl</code> : Boolean<div class="sub-desc">(optional) true to remove the element from the DOM</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Resizable</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-enableBubble"></a><b><a href="source/Observable-more.html#method-Ext.util.Observable-enableBubble">enableBubble</a></b>(&nbsp;<code>Object&nbsp;events</code>&nbsp;)
+                                        void<div class="mdesc"><div class="short">Destroys this resizable. If the element was wrapped and
+removeEl is not true then the element remains.</div><div class="long">Destroys this resizable. If the element was wrapped and
+removeEl is not true then the element remains.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>removeEl</code> : Boolean<div class="sub-desc">(optional) true to remove the element from the DOM</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Resizable</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-enableBubble"></a><b><a href="source/Observable-more.html#method-Ext.util.Observable-enableBubble">enableBubble</a></b>(&nbsp;<code>String/Array&nbsp;events</code>&nbsp;)
     :
-                                        void<div class="mdesc"><div class="short">Used to enable bubbling of events</div><div class="long">Used to enable bubbling of events<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>events</code> : Object<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#enableBubble" ext:member="#enableBubble" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-fireEvent"></a><b><a href="source/Observable.html#method-Ext.util.Observable-fireEvent">fireEvent</a></b>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Object...&nbsp;args</code>&nbsp;)
+                                        void<div class="mdesc"><div class="short">Enables events fired by this Observable to bubble up an owner hierarchy by calling
+this.getBubbleTarget() if present....</div><div class="long"><p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
+<code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
+<p>This is commonly used by Ext.Components to bubble events to owner Containers. See <a href="output/Ext.Component.getBubbleTarget.html" ext:cls="Ext.Component.getBubbleTarget">Ext.Component.getBubbleTarget</a>. The default
+implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
+access the required target more quickly.</p>
+<p>Example:</p><pre><code>Ext.override(Ext.form.Field, {
+    <i>//  Add functionality to Field&#39;s initComponent to enable the change event to bubble</i>
+    initComponent : Ext.form.Field.prototype.initComponent.createSequence(<b>function</b>() {
+        this.enableBubble(<em>'change'</em>);
+    }),
+
+    <i>//  We know that we want Field&#39;s events to bubble directly to the FormPanel.</i>
+    getBubbleTarget : <b>function</b>() {
+        <b>if</b> (!this.formPanel) {
+            this.formPanel = this.findParentByType(<em>'form'</em>);
+        }
+        <b>return</b> this.formPanel;
+    }
+});
+
+<b>var</b> myForm = <b>new</b> Ext.formPanel({
+    title: <em>'User Details'</em>,
+    items: [{
+        ...
+    }],
+    listeners: {
+        change: <b>function</b>() {
+            <i>// Title goes red <b>if</b> form has been modified.</i>
+            myForm.header.setStyle(<em>'color'</em>, <em>'red'</em>);
+        }
+    }
+});</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>events</code> : String/Array<div class="sub-desc">The event name to bubble, or an Array of event names.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#enableBubble" ext:member="#enableBubble" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-fireEvent"></a><b><a href="source/Observable.html#method-Ext.util.Observable-fireEvent">fireEvent</a></b>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Object...&nbsp;args</code>&nbsp;)
     :
                                         Boolean<div class="mdesc"><div class="short">Fires the specified event with the passed parameters (minus the event name).
 An event may be set to bubble up an Obse...</div><div class="long"><p>Fires the specified event with the passed parameters (minus the event name).</p>
@@ -178,41 +212,41 @@ by calling <a href="output/Ext.util.Observable.html#Ext.util.Observable-enableBu
     :
                                         void<div class="mdesc"><div class="short">Removes an event handler.</div><div class="long">Removes an event handler.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The type of event the handler was associated with.</div></li><li><code>handler</code> : Function<div class="sub-desc">The handler to remove. <b>This must be a reference to the function passed into the <a href="output/Ext.util.Observable.html#Ext.util.Observable-addListener" ext:member="addListener" ext:cls="Ext.util.Observable">addListener</a> call.</b></div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope originally specified for the handler.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#removeListener" ext:member="#removeListener" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-resizeElement"></a><b><a href="source/Resizable.html#method-Ext.Resizable-resizeElement">resizeElement</a></b>()
     :
-                                        void<div class="mdesc"><div class="short">Performs resizing of the associated Element. This method is called internally by this&#13;
-class, and should not be calle...</div><div class="long"><p>Performs resizing of the associated Element. This method is called internally by this\r
-class, and should not be called by user code.</p>\r
-<p>If a Resizable is being used to resize an Element which encapsulates a more complex UI\r
-component such as a Panel, this method may be overridden by specifying an implementation\r
-as a config option to provide appropriate behaviour at the end of the resize operation on\r
-mouseup, for example resizing the Panel, and relaying the Panel's content.</p>\r
-<p>The new area to be resized to is available by examining the state of the <a href="output/Ext.Resizable.html#Ext.Resizable-proxy" ext:member="proxy" ext:cls="Ext.Resizable">proxy</a>\r
-Element. Example:\r
-<pre><code><b>new</b> Ext.Panel({\r
-    title: <em>'Resize me'</em>,\r
-    x: 100,\r
-    y: 100,\r
-    renderTo: Ext.getBody(),\r
-    floating: true,\r
-    frame: true,\r
-    width: 400,\r
-    height: 200,\r
-    listeners: {\r
-        render: <b>function</b>(p) {\r
-            <b>new</b> Ext.Resizable(p.getEl(), {\r
-                handles: <em>'all'</em>,\r
-                pinned: true,\r
-                transparent: true,\r
-                resizeElement: <b>function</b>() {\r
-                    <b>var</b> box = this.proxy.getBox();\r
-                    p.updateBox(box);\r
-                    <b>if</b> (p.layout) {\r
-                        p.doLayout();\r
-                    }\r
-                    <b>return</b> box;\r
-                }\r
-           });\r
-       }\r
-    }\r
+                                        void<div class="mdesc"><div class="short">Performs resizing of the associated Element. This method is called internally by this
+class, and should not be called...</div><div class="long"><p>Performs resizing of the associated Element. This method is called internally by this
+class, and should not be called by user code.</p>
+<p>If a Resizable is being used to resize an Element which encapsulates a more complex UI
+component such as a Panel, this method may be overridden by specifying an implementation
+as a config option to provide appropriate behaviour at the end of the resize operation on
+mouseup, for example resizing the Panel, and relaying the Panel's content.</p>
+<p>The new area to be resized to is available by examining the state of the <a href="output/Ext.Resizable.html#Ext.Resizable-proxy" ext:member="proxy" ext:cls="Ext.Resizable">proxy</a>
+Element. Example:
+<pre><code><b>new</b> Ext.Panel({
+    title: <em>'Resize me'</em>,
+    x: 100,
+    y: 100,
+    renderTo: Ext.getBody(),
+    floating: true,
+    frame: true,
+    width: 400,
+    height: 200,
+    listeners: {
+        render: <b>function</b>(p) {
+            <b>new</b> Ext.Resizable(p.getEl(), {
+                handles: <em>'all'</em>,
+                pinned: true,
+                transparent: true,
+                resizeElement: <b>function</b>() {
+                    <b>var</b> box = this.proxy.getBox();
+                    p.updateBox(box);
+                    <b>if</b> (p.layout) {
+                        p.doLayout();
+                    }
+                    <b>return</b> box;
+                }
+           });
+       }
+    }
 }).show();</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Resizable</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.Resizable-resizeTo"></a><b><a href="source/Resizable.html#method-Ext.Resizable-resizeTo">resizeTo</a></b>(&nbsp;<code>Number&nbsp;width</code>,&nbsp;<code>Number&nbsp;height</code>&nbsp;)
     :
                                         void<div class="mdesc"><div class="short">Perform a manual resize and fires the 'resize' event.</div><div class="long">Perform a manual resize and fires the 'resize' event.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>width</code> : Number<div class="sub-desc"></div></li><li><code>height</code> : Number<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Resizable</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.util.Observable-resumeEvents"></a><b><a href="source/Observable.html#method-Ext.util.Observable-resumeEvents">resumeEvents</a></b>()