-to use css style <tt>'display:none;'</tt> to hide the Layer.</div></td><td class="msource">Layer</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Layer-zindex"></a><b><a href="source/Layer.html#cfg-Ext.Layer-zindex">zindex</a></b> : Number<div class="mdesc">Starting z-index (defaults to 11000)</div></td><td class="msource">Layer</td></tr></tbody></table><a id="Ext.Layer-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 inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-DISPLAY"></a><b><a href="source/Element.fx.html#prop-Ext.Element-DISPLAY">DISPLAY</a></b> : Number<div class="mdesc">Visibility mode constant for use with <a href="output/Ext.Element.html#Ext.Element-setVisibilityMode" ext:member="setVisibilityMode" ext:cls="Ext.Element">setVisibilityMode</a>. Use display to hide element</div></td><td class="msource"><a href="output/Ext.Element.html#DISPLAY" ext:member="#DISPLAY" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-VISIBILITY"></a><b><a href="source/Element.fx.html#prop-Ext.Element-VISIBILITY">VISIBILITY</a></b> : Number<div class="mdesc">Visibility mode constant for use with <a href="output/Ext.Element.html#Ext.Element-setVisibilityMode" ext:member="setVisibilityMode" ext:cls="Ext.Element">setVisibilityMode</a>. Use visibility to hide element</div></td><td class="msource"><a href="output/Ext.Element.html#VISIBILITY" ext:member="#VISIBILITY" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-autoBoxAdjust"></a><b><a href="source/Element.html#prop-Ext.Element-autoBoxAdjust">autoBoxAdjust</a></b> : Object<div class="mdesc">true to automatically adjust width and height settings for box-model issues (default to true)</div></td><td class="msource"><a href="output/Ext.Element.html#autoBoxAdjust" ext:member="#autoBoxAdjust" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-defaultUnit"></a><b><a href="source/Element.html#prop-Ext.Element-defaultUnit">defaultUnit</a></b> : String<div class="mdesc">The default unit to append to CSS values where a unit isn't provided (defaults to px).</div></td><td class="msource"><a href="output/Ext.Element.html#defaultUnit" ext:member="#defaultUnit" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-dom"></a><b><a href="source/Element.html#prop-Ext.Element-dom">dom</a></b> : HTMLElement<div class="mdesc">The DOM element</div></td><td class="msource"><a href="output/Ext.Element.html#dom" ext:member="#dom" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-id"></a><b><a href="source/Element.html#prop-Ext.Element-id">id</a></b> : String<div class="mdesc">The DOM element ID</div></td><td class="msource"><a href="output/Ext.Element.html#id" ext:member="#id" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-originalDisplay"></a><b><a href="source/Element.fx.html#prop-Ext.Element-originalDisplay">originalDisplay</a></b> : String<div class="mdesc">The element's default display mode (defaults to "")</div></td><td class="msource"><a href="output/Ext.Element.html#originalDisplay" ext:member="#originalDisplay" ext:cls="Ext.Element">Element</a></td></tr></tbody></table><a id="Ext.Layer-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"> </a></td><td class="sig"><a id="Ext.Layer-Layer"></a><b><a href="source/Layer.html#cls-Ext.Layer">Layer</a></b>( <code>Object config</code>, <span title="Optional" class="optional">[<code>String/HTMLElement existingEl</code>]</span> )\r
- <div class="mdesc"><div class="short"></div><div class="long"><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">An object with config options.</div></li><li><code>existingEl</code> : String/HTMLElement<div class="sub-desc">(optional) Uses an existing DOM element. If the element is not found it creates it.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Layer</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClass"></a><b><a href="source/Element.style.html#method-Ext.Element-addClass">addClass</a></b>( <code>String/Array className</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.</div><div class="long">Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String/Array<div class="sub-desc">The CSS class to add, or an array of classes</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClass" ext:member="#addClass" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClassOnClick"></a><b><a href="source/Element.style-more.html#method-Ext.Element-addClassOnClick">addClassOnClick</a></b>( <code>String className</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effe...</div><div class="long">Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effect)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClassOnClick" ext:member="#addClassOnClick" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClassOnFocus"></a><b><a href="source/Element.style-more.html#method-Ext.Element-addClassOnFocus">addClassOnFocus</a></b>( <code>String className</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Sets up event handlers to add and remove a css class when this element has the focus</div><div class="long">Sets up event handlers to add and remove a css class when this element has the focus<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClassOnFocus" ext:member="#addClassOnFocus" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClassOnOver"></a><b><a href="source/Element.style-more.html#method-Ext.Element-addClassOnOver">addClassOnOver</a></b>( <code>String className</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Sets up event handlers to add and remove a css class when the mouse is over this element</div><div class="long">Sets up event handlers to add and remove a css class when the mouse is over this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClassOnOver" ext:member="#addClassOnOver" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addKeyListener"></a><b><a href="source/Element.keys.html#method-Ext.Element-addKeyListener">addKeyListener</a></b>( <code>Number/Array/Object/String key</code>, <code>Function fn</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span> )\r
- :\r
- Ext.KeyMap<div class="mdesc"><div class="short">Convenience method for constructing a KeyMap</div><div class="long">Convenience method for constructing a KeyMap<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>key</code> : Number/Array/Object/String<div class="sub-desc">Either a string with the keys to listen for, the numeric key code, array of key codes or an object with the following options:\r
-{key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}</div></li><li><code>fn</code> : Function<div class="sub-desc">The function to call</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope of the function</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.KeyMap</code><div class="sub-desc">The KeyMap created</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addKeyListener" ext:member="#addKeyListener" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addKeyMap"></a><b><a href="source/Element.keys.html#method-Ext.Element-addKeyMap">addKeyMap</a></b>( <code>Object config</code> )\r
- :\r
- Ext.KeyMap<div class="mdesc"><div class="short">Creates a KeyMap for this element</div><div class="long">Creates a KeyMap for this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">The KeyMap config. See <a href="output/Ext.KeyMap.html" ext:cls="Ext.KeyMap">Ext.KeyMap</a> for more details</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.KeyMap</code><div class="sub-desc">The KeyMap created</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addKeyMap" ext:member="#addKeyMap" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addListener"></a><b><a href="source/Element.html#method-Ext.Element-addListener">addListener</a></b>( <code>String eventName</code>, <code>Function fn</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span>, <span title="Optional" class="optional">[<code>Object options</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Appends an event handler to this element. The shorthand version on is equivalent.</div><div class="long">Appends an event handler to this element. The shorthand version <a href="output/Ext.Element.html#Ext.Element-on" ext:member="on" ext:cls="Ext.Element">on</a> is equivalent.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The name of event to handle.</div></li><li><code>fn</code> : Function<div class="sub-desc">The handler function the event invokes. This function is passed\r
-the following parameters:<ul>\r
-<li><b>evt</b> : EventObject<div class="sub-desc">The <a href="output/Ext.EventObject.html" ext:cls="Ext.EventObject">EventObject</a> describing the event.</div></li>\r
-<li><b>el</b> : HtmlElement<div class="sub-desc">The DOM element which was the target of the event.\r
-Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>\r
-<li><b>o</b> : Object<div class="sub-desc">The options object from the addListener call.</div></li>\r
-</ul></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.\r
-<b>If omitted, defaults to this Element.</b>.</div></li><li><code>options</code> : Object<div class="sub-desc">(optional) An object containing handler configuration properties.\r
-This may contain any of the following properties:<ul>\r
-<li><b>scope</b> Object : <div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.\r
-<b>If omitted, defaults to this Element.</b></div></li>\r
-<li><b>delegate</b> String: <div class="sub-desc">A simple selector to filter the target or look for a descendant of the target. See below for additional details.</div></li>\r
-<li><b>stopEvent</b> Boolean: <div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>\r
-<li><b>preventDefault</b> Boolean: <div class="sub-desc">True to prevent the default action</div></li>\r
-<li><b>stopPropagation</b> Boolean: <div class="sub-desc">True to prevent event propagation</div></li>\r
-<li><b>normalized</b> Boolean: <div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>\r
-<li><b>target</b> Ext.Element: <div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>\r
-<li><b>delay</b> Number: <div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>\r
-<li><b>single</b> Boolean: <div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>\r
-<li><b>buffer</b> Number: <div class="sub-desc">Causes the handler to be scheduled to run in an <a href="output/Ext.util.DelayedTask.html" ext:cls="Ext.util.DelayedTask">Ext.util.DelayedTask</a> delayed\r
-by the specified number of milliseconds. If the event fires again within that time, the original\r
-handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>\r
-</ul><br>\r
-<p>\r
-<b>Combining Options</b><br>\r
-In the following examples, the shorthand form <a href="output/Ext.Element.html#Ext.Element-on" ext:member="on" ext:cls="Ext.Element">on</a> is used rather than the more verbose\r
-addListener. The two are equivalent. Using the options argument, it is possible to combine different\r
-types of listeners:<br>\r
-<br>\r
-A delayed, one-time listener that auto stops the event and adds a custom argument (forumId) to the\r
-options object. The options object is available as the third parameter in the handler function.<div style="margin: 5px 20px 20px;">\r
-Code:<pre><code>el.on(<em>'click'</em>, this.onClick, this, {\r
- single: true,\r
- delay: 100,\r
- stopEvent : true,\r
- forumId: 4\r
-});</code></pre></p>\r
-<p>\r
-<b>Attaching multiple handlers in 1 call</b><br>\r
-The method also allows for a single argument to be passed which is a config object containing properties\r
-which specify multiple handlers.</p>\r
-<p>\r
-Code:<pre><code>el.on({\r
- <em>'click'</em> : {\r
- fn: this.onClick,\r
- scope: this,\r
- delay: 100\r
- },\r
- <em>'mouseover'</em> : {\r
- fn: this.onMouseOver,\r
- scope: this\r
- },\r
- <em>'mouseout'</em> : {\r
- fn: this.onMouseOut,\r
- scope: this\r
- }\r
-});</code></pre>\r
-<p>\r
-Or a shorthand syntax:<br>\r
-Code:<pre><code></p>\r
-el.on({\r
- <em>'click'</em> : this.onClick,\r
- <em>'mouseover'</em> : this.onMouseOver,\r
- <em>'mouseout'</em> : this.onMouseOut,\r
- scope: this\r
-});</code></pre></p>\r
-<p><b>delegate</b></p>\r
-<p>This is a configuration option that you can pass along when registering a handler for\r
-an event to assist with event delegation. Event delegation is a technique that is used to\r
-reduce memory consumption and prevent exposure to memory-leaks. By registering an event\r
-for a container element as opposed to each element within a container. By setting this\r
-configuration option to a simple selector, the target element will be filtered to look for\r
-a descendant of the target.\r
-For example:<pre><code><i>// using this markup:\r</i>
-<div id=<em>'elId'</em>>\r
- <p id=<em>'p1'</em>>paragraph one</p>\r
- <p id=<em>'p2'</em> class=<em>'clickable'</em>>paragraph two</p>\r
- <p id=<em>'p3'</em>>paragraph three</p>\r
-</div>\r
-<i>// utilize event delegation to registering just one handler on the container element: \r</i>
-el = Ext.get(<em>'elId'</em>);\r
-el.on(\r
- <em>'click'</em>,\r
- <b>function</b>(e,t) {\r
- <i>// handle click\r</i>
- console.info(t.id); <i>// <em>'p2'</em>\r</i>
- },\r
- this,\r
- {\r
- <i>// filter the target element to be a descendant <b>with</b> the class <em>'clickable'</em>\r</i>
- delegate: <em>'.clickable'</em> \r
- }\r
-);</code></pre></p></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addListener" ext:member="#addListener" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-alignTo"></a><b><a href="source/Element.alignment.html#method-Ext.Element-alignTo">alignTo</a></b>( <code>Mixed element</code>, <code>String position</code>, <span title="Optional" class="optional">[<code>Array offsets</code>]</span>, <span title="Optional" class="optional">[<code>Boolean/Object animate</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Aligns this element with another element relative to the specified anchor points. If the other element is the \r
-docume...</div><div class="long">Aligns this element with another element relative to the specified anchor points. If the other element is the\r
-document it aligns it to the viewport.\r
-The position parameter is optional, and can be specified in any one of the following formats:\r
-<ul>\r
-<li><b>Blank</b>: Defaults to aligning the element's top-left corner to the target's bottom-left corner ("tl-bl").</li>\r
-<li><b>One anchor (deprecated)</b>: The passed anchor position is used as the target element's anchor point.\r
-The element being aligned will position its top-left corner (tl) to that point. <i>This method has been\r
-deprecated in favor of the newer two anchor syntax below</i>.</li>\r
-<li><b>Two anchors</b>: If two values from the table below are passed separated by a dash, the first value is used as the\r
-element's anchor point, and the second value is used as the target's anchor point.</li>\r
-</ul>\r
-In addition to the anchor points, the position parameter also supports the "?" character. If "?" is passed at the end of\r
-the position string, the element will attempt to align as specified, but the position will be adjusted to constrain to\r
-the viewport if necessary. Note that the element being aligned might be swapped to align to a different position than\r
-that specified in order to enforce the viewport constraints.\r
-Following are all of the supported anchor positions:\r
-<pre>\r
-Value Description\r
------ -----------------------------\r
-tl The top left corner (default)\r
-t The center of the top edge\r
-tr The top right corner\r
-l The center of the left edge\r
-c In the center of the element\r
-r The center of the right edge\r
-bl The bottom left corner\r
-b The center of the bottom edge\r
-br The bottom right corner\r
-</pre>\r
-Example Usage:\r
-<pre><code><i>// align el to other-el using the <b>default</b> positioning (<em>"tl-bl"</em>, non-constrained)\r</i>
-el.alignTo(<em>"other-el"</em>);\r
-\r
-<i>// align the top left corner of el <b>with</b> the top right corner of other-el (constrained to viewport)\r</i>
-el.alignTo(<em>"other-el"</em>, <em>"tr?"</em>);\r
-\r
-<i>// align the bottom right corner of el <b>with</b> the center left edge of other-el\r</i>
-el.alignTo(<em>"other-el"</em>, <em>"br-l?"</em>);\r
-\r
-<i>// align the center of el <b>with</b> the bottom left corner of other-el and\r</i>
-<i>// adjust the x position by -6 pixels (and the y position by 0)\r</i>
-el.alignTo(<em>"other-el"</em>, <em>"c-bl"</em>, [-6, 0]);</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to.</div></li><li><code>position</code> : String<div class="sub-desc">The position to align to.</div></li><li><code>offsets</code> : Array<div class="sub-desc">(optional) Offset the positioning by [x, y]</div></li><li><code>animate</code> : Boolean/Object<div class="sub-desc">(optional) true for the default animation or a standard Element animation config object</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#alignTo" ext:member="#alignTo" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-anchorTo"></a><b><a href="source/Element.alignment.html#method-Ext.Element-anchorTo">anchorTo</a></b>( <code>Mixed element</code>, <code>String position</code>, <span title="Optional" class="optional">[<code>Array offsets</code>]</span>, <span title="Optional" class="optional">[<code>Boolean/Object animate</code>]</span>, <span title="Optional" class="optional">[<code>Boolean/Number monitorScroll</code>]</span>, <code>Function callback</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Anchors an element to another element and realigns it when the window is resized.</div><div class="long">Anchors an element to another element and realigns it when the window is resized.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to.</div></li><li><code>position</code> : String<div class="sub-desc">The position to align to.</div></li><li><code>offsets</code> : Array<div class="sub-desc">(optional) Offset the positioning by [x, y]</div></li><li><code>animate</code> : Boolean/Object<div class="sub-desc">(optional) True for the default animation or a standard Element animation config object</div></li><li><code>monitorScroll</code> : Boolean/Number<div class="sub-desc">(optional) True to monitor body scroll and reposition. If this parameter\r
-is a number, it is used as the buffer delay (defaults to 50ms).</div></li><li><code>callback</code> : Function<div class="sub-desc">The function to call after the animation finishes</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#anchorTo" ext:member="#anchorTo" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-animate"></a><b><a href="source/Element.fx.html#method-Ext.Element-animate">animate</a></b>( <code>Object args</code>, <span title="Optional" class="optional">[<code>Float duration</code>]</span>, <span title="Optional" class="optional">[<code>Function onComplete</code>]</span>, <span title="Optional" class="optional">[<code>String easing</code>]</span>, <span title="Optional" class="optional">[<code>String animType</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Perform custom animation on this element. \r
-<ul class="mdetail-params"> \r
-Animation Properties \r
-The Animation Control O...</div><div class="long">Perform custom animation on this element.\r
-<div><ul class="mdetail-params">\r
-<li><u>Animation Properties</u></li>\r
-<p>The Animation Control Object enables gradual transitions for any member of an\r
-element's style object that takes a numeric value including but not limited to\r
-these properties:</p><div><ul class="mdetail-params">\r
-<li><tt>bottom, top, left, right</tt></li>\r
-<li><tt>height, width</tt></li>\r
-<li><tt>margin, padding</tt></li>\r
-<li><tt>borderWidth</tt></li>\r
-<li><tt>opacity</tt></li>\r
-<li><tt>fontSize</tt></li>\r
-<li><tt>lineHeight</tt></li>\r
-</ul></div>\r
-<li><u>Animation Property Attributes</u></li>\r
-<p>Each Animation Property is a config object with optional properties:</p>\r
-<div><ul class="mdetail-params">\r
-<li><tt>by</tt>* : relative change - start at current value, change by this value</li>\r
-<li><tt>from</tt> : ignore current value, start from this value</li>\r
-<li><tt>to</tt>* : start at current value, go to this value</li>\r
-<li><tt>unit</tt> : any allowable unit specification</li>\r
-<p>* do not specify both <tt>to</tt> and <tt>by</tt> for an animation property</p>\r
-</ul></div>\r
-<li><u>Animation Types</u></li>\r
-<p>The supported animation types:</p><div><ul class="mdetail-params">\r
-<li><tt>'run'</tt> : Default\r
-<pre><code><b>var</b> el = Ext.get(<em>'complexEl'</em>);\r
-el.animate(\r
- <i>// animation control object\r</i>
- {\r
- borderWidth: {to: 3, from: 0},\r
- opacity: {to: .3, from: 1},\r
- height: {to: 50, from: el.getHeight()},\r
- width: {to: 300, from: el.getWidth()},\r
- top : {by: - 100, unit: <em>'px'</em>},\r
- },\r
- 0.35, <i>// animation duration\r</i>
- null, <i>// callback\r</i>
- <em>'easeOut'</em>, <i>// easing method\r</i>
- <em>'run'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>) \r</i>
-);</code></pre>\r
-</li>\r
-<li><tt>'color'</tt>\r
-<p>Animates transition of background, text, or border colors.</p>\r
-<pre><code>el.animate(\r
- <i>// animation control object\r</i>
- {\r
- color: { to: <em>'#06e'</em> },\r
- backgroundColor: { to: <em>'#e06'</em> }\r
- },\r
- 0.35, <i>// animation duration\r</i>
- null, <i>// callback\r</i>
- <em>'easeOut'</em>, <i>// easing method\r</i>
- <em>'color'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>) \r</i>
-);</code></pre> \r
-</li>\r
-<li><tt>'motion'</tt>\r
-<p>Animates the motion of an element to/from specific points using optional bezier\r
-way points during transit.</p>\r
-<pre><code>el.animate(\r
- <i>// animation control object\r</i>
- {\r
- borderWidth: {to: 3, from: 0},\r
- opacity: {to: .3, from: 1},\r
- height: {to: 50, from: el.getHeight()},\r
- width: {to: 300, from: el.getWidth()},\r
- top : {by: - 100, unit: <em>'px'</em>},\r
- points: {\r
- to: [50, 100], <i>// go to this point\r</i>
- control: [ <i>// optional bezier way points\r</i>
- [ 600, 800],\r
- [-100, 200]\r
- ]\r
- }\r
- },\r
- 3000, <i>// animation duration (milliseconds!)\r</i>
- null, <i>// callback\r</i>
- <em>'easeOut'</em>, <i>// easing method\r</i>
- <em>'motion'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>) \r</i>
-);</code></pre> \r
-</li>\r
-<li><tt>'scroll'</tt>\r
-<p>Animate horizontal or vertical scrolling of an overflowing page element.</p>\r
-<pre><code>el.animate(\r
- <i>// animation control object\r</i>
- {\r
- scroll: {to: [400, 300]}\r
- },\r
- 0.35, <i>// animation duration\r</i>
- null, <i>// callback\r</i>
- <em>'easeOut'</em>, <i>// easing method\r</i>
- <em>'scroll'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>) \r</i>
-);</code></pre> \r
-</li>\r
-</ul></div>\r
-</ul></div><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>args</code> : Object<div class="sub-desc">The animation control args</div></li><li><code>duration</code> : Float<div class="sub-desc">(optional) How long the animation lasts in seconds (defaults to <tt>.35</tt>)</div></li><li><code>onComplete</code> : Function<div class="sub-desc">(optional) Function to call when animation completes</div></li><li><code>easing</code> : String<div class="sub-desc">(optional) <a href="output/Ext.Fx.html#Ext.Fx-easing" ext:member="easing" ext:cls="Ext.Fx">Ext.Fx.easing</a> method to use (defaults to <tt>'easeOut'</tt>)</div></li><li><code>animType</code> : String<div class="sub-desc">(optional) <tt>'run'</tt> is the default. Can also be <tt>'color'</tt>,\r
-<tt>'motion'</tt>, or <tt>'scroll'</tt></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#animate" ext:member="#animate" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-appendChild"></a><b><a href="source/Element.insertion.html#method-Ext.Element-appendChild">appendChild</a></b>( <code>String/HTMLElement/Array/Element/CompositeElement el</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Appends the passed element(s) to this element</div><div class="long">Appends the passed element(s) to this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : String/HTMLElement/Array/Element/CompositeElement<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#appendChild" ext:member="#appendChild" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-appendTo"></a><b><a href="source/Element.insertion.html#method-Ext.Element-appendTo">appendTo</a></b>( <code>Mixed el</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Appends this element to the passed element</div><div class="long">Appends this element to the passed element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : Mixed<div class="sub-desc">The new parent element</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#appendTo" ext:member="#appendTo" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-applyStyles"></a><b><a href="source/Element.style-more.html#method-Ext.Element-applyStyles">applyStyles</a></b>( <code>String/Object/Function styles</code> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">More flexible version of setStyle for setting style properties.</div><div class="long">More flexible version of <a href="output/Ext.Element.html#Ext.Element-setStyle" ext:member="setStyle" ext:cls="Ext.Element">setStyle</a> for setting style properties.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>styles</code> : String/Object/Function<div class="sub-desc">A style specification string, e.g. "width:100px", or object in the form {width:"100px"}, or\r
-a function which returns such a specification.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#applyStyles" ext:member="#applyStyles" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-autoHeight"></a><b><a href="source/Element.legacy.html#method-Ext.Element-autoHeight">autoHeight</a></b>( <span title="Optional" class="optional">[<code>Boolean animate</code>]</span>, <span title="Optional" class="optional">[<code>Float duration</code>]</span>, <span title="Optional" class="optional">[<code>Function onComplete</code>]</span>, <span title="Optional" class="optional">[<code>String easing</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Measures the element's content height and updates height to match. Note: this function uses setTimeout so \r
-the new he...</div><div class="long">Measures the element's content height and updates height to match. Note: this function uses setTimeout so\r
-the new height may not be available immediately.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>animate</code> : Boolean<div class="sub-desc">(optional) Animate the transition (defaults to false)</div></li><li><code>duration</code> : Float<div class="sub-desc">(optional) Length of the animation in seconds (defaults to .35)</div></li><li><code>onComplete</code> : Function<div class="sub-desc">(optional) Function to call when animation completes</div></li><li><code>easing</code> : String<div class="sub-desc">(optional) Easing method to use (defaults to easeOut)</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#autoHeight" ext:member="#autoHeight" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-blur"></a><b><a href="source/Element.html#method-Ext.Element-blur">blur</a></b>()\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Tries to blur the element. Any exceptions are caught and ignored.</div><div class="long">Tries to blur the element. Any exceptions are caught and ignored.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#blur" ext:member="#blur" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-boxWrap"></a><b><a href="source/Element.style-more.html#method-Ext.Element-boxWrap">boxWrap</a></b>( <span title="Optional" class="optional">[<code>String class</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Wraps the specified element with a special 9 element markup/CSS block that renders by default as \r
-a gray container wi...</div><div class="long"><p>Wraps the specified element with a special 9 element markup/CSS block that renders by default as\r
-a gray container with a gradient background, rounded corners and a 4-way shadow.</p>\r
-<p>This special markup is used throughout Ext when box wrapping elements (<a href="output/Ext.Button.html" ext:cls="Ext.Button">Ext.Button</a>,\r
-<a href="output/Ext.Panel.html" ext:cls="Ext.Panel">Ext.Panel</a> when <tt><a href="output/Ext.Panel.html#Ext.Panel-frame" ext:member="frame" ext:cls="Ext.Panel">frame=true</a></tt>, <a href="output/Ext.Window.html" ext:cls="Ext.Window">Ext.Window</a>). The markup\r
-is of this form:</p>\r
-<pre><code>Ext.Element.boxMarkup =\r
- '<div class=<em>"{0}-tl"</em>><div class=<em>"{0}-tr"</em>><div class=<em>"{0}-tc"</em>></div></div></div>\r
- <div class=<em>"{0}-ml"</em>><div class=<em>"{0}-mr"</em>><div class=<em>"{0}-mc"</em>></div></div></div>\r
- <div class=<em>"{0}-bl"</em>><div class=<em>"{0}-br"</em>><div class=<em>"{0}-bc"</em>></div></div></div>';</code></pre>\r
-<p>Example usage:</p>\r
-<pre><code><i>// Basic box wrap\r</i>
-Ext.get(<em>"foo"</em>).boxWrap();\r
-\r
-<i>// You can also add a custom class and use CSS inheritance rules to customize the box look.\r</i>
-<i>// <em>'x-box-blue'</em> is a built-<b>in</b> alternative -- look at the related CSS definitions as an example\r</i>
-<i>// <b>for</b> how to create a custom box wrap style.\r</i>
-Ext.get(<em>"foo"</em>).boxWrap().addClass(<em>"x-box-blue"</em>);</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>class</code> : String<div class="sub-desc">(optional) A base CSS class to apply to the containing wrapper element\r
-(defaults to <tt>'x-box'</tt>). Note that there are a number of CSS rules that are dependent on\r
-this name to make the overall effect work, so if you supply an alternate base class, make sure you\r
-also supply all of the necessary rules.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#boxWrap" ext:member="#boxWrap" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-center"></a><b><a href="source/Element.alignment.html#method-Ext.Element-center">center</a></b>( <span title="Optional" class="optional">[<code>Mixed centerIn</code>]</span> )\r
- :\r
- void<div class="mdesc"><div class="short">Centers the Element in either the viewport, or another Element.</div><div class="long">Centers the Element in either the viewport, or another Element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>centerIn</code> : Mixed<div class="sub-desc">(optional) The element in which to center the element.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#center" ext:member="#center" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-child"></a><b><a href="source/Element.traversal.html#method-Ext.Element-child">child</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )\r
- :\r
- HTMLElement/Ext.Element<div class="mdesc"><div class="short">Selects a single child at any depth below this element based on the passed CSS selector (the selector should not cont...</div><div class="long">Selects a single child at any depth below this element based on the passed CSS selector (the selector should not contain an id).<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The CSS selector</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) True to return the DOM node instead of Ext.Element (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement/Ext.Element</code><div class="sub-desc">The child Ext.Element (or DOM node if returnDom = true)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#child" ext:member="#child" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clean"></a><b><a href="source/Element-more.html#method-Ext.Element-clean">clean</a></b>( <span title="Optional" class="optional">[<code>Boolean forceReclean</code>]</span> )\r
- :\r
- void<div class="mdesc"><div class="short">Removes worthless text nodes</div><div class="long">Removes worthless text nodes<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>forceReclean</code> : Boolean<div class="sub-desc">(optional) By default the element\r
-keeps track if it has been cleaned already so\r
-you can call this over and over. However, if you update the element and\r
-need to force a reclean, you can pass true.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clean" ext:member="#clean" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clearOpacity"></a><b><a href="source/Element.style.html#method-Ext.Element-clearOpacity">clearOpacity</a></b>()\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Clears any opacity settings from this element. Required in some cases for IE.</div><div class="long">Clears any opacity settings from this element. Required in some cases for IE.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clearOpacity" ext:member="#clearOpacity" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clearPositioning"></a><b><a href="source/Element.position.html#method-Ext.Element-clearPositioning">clearPositioning</a></b>( <span title="Optional" class="optional">[<code>String value</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Clear positioning back to the default when the document was loaded</div><div class="long">Clear positioning back to the default when the document was loaded<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>value</code> : String<div class="sub-desc">(optional) The value to use for the left,right,top,bottom, defaults to '' (empty string). You could use 'auto'.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clearPositioning" ext:member="#clearPositioning" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clip"></a><b><a href="source/Element.style.html#method-Ext.Element-clip">clip</a></b>()\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Store the current overflow setting and clip overflow on the element - use unclip to remove</div><div class="long">Store the current overflow setting and clip overflow on the element - use <tt><a href="output/Ext.Element.html#Ext.Element-unclip" ext:member="unclip" ext:cls="Ext.Element">unclip</a></tt> to remove<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clip" ext:member="#clip" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-contains"></a><b><a href="source/Element.html#method-Ext.Element-contains">contains</a></b>( <code>HTMLElement/String el</code> )\r
- :\r
- Boolean<div class="mdesc"><div class="short">Returns true if this element is an ancestor of the passed element</div><div class="long">Returns true if this element is an ancestor of the passed element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : HTMLElement/String<div class="sub-desc">The element to check</div></li></ul><strong>Returns:</strong><ul><li><code>Boolean</code><div class="sub-desc">True if this element is an ancestor of el, else false</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#contains" ext:member="#contains" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-createChild"></a><b><a href="source/Element.insertion.html#method-Ext.Element-createChild">createChild</a></b>( <code>Object config</code>, <span title="Optional" class="optional">[<code>HTMLElement insertBefore</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child e...</div><div class="long">Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">DomHelper element config object. If no tag is specified (e.g., {tag:'input'}) then a div will be\r
-automatically generated with the specified attributes.</div></li><li><code>insertBefore</code> : HTMLElement<div class="sub-desc">(optional) a child element of this element</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) true to return the dom node instead of creating an Element</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The new child element</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#createChild" ext:member="#createChild" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-createProxy"></a><b><a href="source/Element-more.html#method-Ext.Element-createProxy">createProxy</a></b>( <code>String/Object config</code>, <span title="Optional" class="optional">[<code>String/HTMLElement renderTo</code>]</span>, <span title="Optional" class="optional">[<code>Boolean matchBox</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Creates a proxy element of this element</div><div class="long">Creates a proxy element of this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : String/Object<div class="sub-desc">The class name of the proxy element or a DomHelper config object</div></li><li><code>renderTo</code> : String/HTMLElement<div class="sub-desc">(optional) The element or element id to render the proxy to (defaults to document.body)</div></li><li><code>matchBox</code> : Boolean<div class="sub-desc">(optional) True to align and size the proxy to this element now (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The new proxy element</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#createProxy" ext:member="#createProxy" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-createShim"></a><b><a href="source/Element.fx-more.html#method-Ext.Element-createShim">createShim</a></b>()\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Creates an iframe shim for this element to keep selects and other windowed objects from \r
-showing through.</div><div class="long">Creates an iframe shim for this element to keep selects and other windowed objects from\r
-showing through.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The new shim element</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#createShim" ext:member="#createShim" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-down"></a><b><a href="source/Element.traversal.html#method-Ext.Element-down">down</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )\r
- :\r
- HTMLElement/Ext.Element<div class="mdesc"><div class="short">Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).</div><div class="long">Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The CSS selector</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) True to return the DOM node instead of Ext.Element (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement/Ext.Element</code><div class="sub-desc">The child Ext.Element (or DOM node if returnDom = true)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#down" ext:member="#down" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-enableDisplayMode"></a><b><a href="source/Element.fx-more.html#method-Ext.Element-enableDisplayMode">enableDisplayMode</a></b>( <span title="Optional" class="optional">[<code>String display</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Convenience method for setVisibilityMode(Element.DISPLAY)</div><div class="long">Convenience method for setVisibilityMode(Element.DISPLAY)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>display</code> : String<div class="sub-desc">(optional) What to set display to when visible</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#enableDisplayMode" ext:member="#enableDisplayMode" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-findParent"></a><b><a href="source/Element.traversal.html#method-Ext.Element-findParent">findParent</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Number/Mixed maxDepth</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnEl</code>]</span> )\r
- :\r
- HTMLElement<div class="mdesc"><div class="short">Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:fi...</div><div class="long">Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The simple selector to test</div></li><li><code>maxDepth</code> : Number/Mixed<div class="sub-desc">(optional) The max depth to search as a number or element (defaults to 50 || document.body)</div></li><li><code>returnEl</code> : Boolean<div class="sub-desc">(optional) True to return a Ext.Element object instead of DOM node</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement</code><div class="sub-desc">The matching DOM node (or null if no match was found)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#findParent" ext:member="#findParent" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-findParentNode"></a><b><a href="source/Element.traversal.html#method-Ext.Element-findParentNode">findParentNode</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Number/Mixed maxDepth</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnEl</code>]</span> )\r
- :\r
- HTMLElement<div class="mdesc"><div class="short">Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)</div><div class="long">Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The simple selector to test</div></li><li><code>maxDepth</code> : Number/Mixed<div class="sub-desc">(optional) The max depth to\r
- search as a number or element (defaults to 10 || document.body)</div></li><li><code>returnEl</code> : Boolean<div class="sub-desc">(optional) True to return a Ext.Element object instead of DOM node</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement</code><div class="sub-desc">The matching DOM node (or null if no match was found)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#findParentNode" ext:member="#findParentNode" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-first"></a><b><a href="source/Element.traversal.html#method-Ext.Element-first">first</a></b>( <span title="Optional" class="optional">[<code>String selector</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )\r
- :\r
- Ext.Element/HTMLElement<div class="mdesc"><div class="short">Gets the first child, skipping text nodes</div><div class="long">Gets the first child, skipping text nodes<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">(optional) Find the next sibling that matches the passed simple selector</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) True to return a raw dom node instead of an Ext.Element</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element/HTMLElement</code><div class="sub-desc">The first child or null</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#first" ext:member="#first" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-fly"></a><b><a href="source/Element.html#method-Ext.Element-fly">fly</a></b>( <code>String/HTMLElement el</code>, <span title="Optional" class="optional">[<code>String named</code>]</span> )\r
- :\r
- Element<div class="mdesc"><div class="short">Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to t...</div><div class="long"><p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -\r
-the dom node can be overwritten by other code. Shorthand of <a href="output/Ext.Element.html#Ext.Element-fly" ext:member="fly" ext:cls="Ext.Element">Ext.Element.fly</a></p>\r
-<p>Use this to make one-time references to DOM elements which are not going to be accessed again either by\r
-application code, or by Ext's classes. If accessing an element which will be processed regularly, then <a href="output/Ext.html#Ext-get" ext:member="get" ext:cls="Ext">Ext.get</a>\r
-will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : String/HTMLElement<div class="sub-desc">The dom node or id</div></li><li><code>named</code> : String<div class="sub-desc">(optional) Allows for creation of named reusable flyweights to prevent conflicts\r
-(e.g. internally Ext uses "_global")</div></li></ul><strong>Returns:</strong><ul><li><code>Element</code><div class="sub-desc">The shared Element object (or null if no matching element was found)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#fly" ext:member="#fly" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-focus"></a><b><a href="source/Element.html#method-Ext.Element-focus">focus</a></b>( <span title="Optional" class="optional">[<code>Number defer</code>]</span> )\r
- :\r
- Ext.Element<div class="mdesc"><div class="short">Tries to focus the element. Any exceptions are caught and ignored.</div><div class="long">Tries to focus the element. Any exceptions are caught and ignored.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>defer</code> : Number<div class="sub-desc">(optional) Milliseconds to defer the focus</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#focus" ext:member="#focus" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAlignToXY"></a><b><a href="source/Element.alignment.html#method-Ext.Element-getAlignToXY">getAlignToXY</a></b>( <code>Mixed element</code>, <code>String position</code>, <span title="Optional" class="optional">[<code>Array offsets</code>]</span> )\r
- :\r
- Array<div class="mdesc"><div class="short">Gets the x,y coordinates to align this element with another element. See alignTo for more info on the \r
-supported posi...</div><div class="long">Gets the x,y coordinates to align this element with another element. See <a href="output/Ext.Element.html#Ext.Element-alignTo" ext:member="alignTo" ext:cls="Ext.Element">alignTo</a> for more info on the\r
-supported position values.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to.</div></li><li><code>position</code> : String<div class="sub-desc">The position to align to.</div></li><li><code>offsets</code> : Array<div class="sub-desc">(optional) Offset the positioning by [x, y]</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">[x, y]</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAlignToXY" ext:member="#getAlignToXY" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAnchorXY"></a><b><a href="source/Element.alignment.html#method-Ext.Element-getAnchorXY">getAnchorXY</a></b>( <span title="Optional" class="optional">[<code>String anchor</code>]</span>, <span title="Optional" class="optional">[<code>Boolean local</code>]</span>, <span title="Optional" class="optional">[<code>Object size</code>]</span> )\r
- :\r
- Array<div class="mdesc"><div class="short">Gets the x,y coordinates specified by the anchor position on the element.</div><div class="long">Gets the x,y coordinates specified by the anchor position on the element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>anchor</code> : String<div class="sub-desc">(optional) The specified anchor position (defaults to "c"). See <a href="output/Ext.Element.html#Ext.Element-alignTo" ext:member="alignTo" ext:cls="Ext.Element">alignTo</a>\r
-for details on supported anchor positions.</div></li><li><code>local</code> : Boolean<div class="sub-desc">(optional) True to get the local (element top/left-relative) anchor position instead\r
-of page coordinates</div></li><li><code>size</code> : Object<div class="sub-desc">(optional) An object containing the size to use for calculating anchor position\r
-{width: (target width), height: (target height)} (defaults to the element's current size)</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">[x, y] An array containing the element's x and y coordinates</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAnchorXY" ext:member="#getAnchorXY" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAttribute"></a><b><a href="source/Element.html#method-Ext.Element-getAttribute">getAttribute</a></b>( <code>String name</code>, <span title="Optional" class="optional">[<code>String namespace</code>]</span> )\r
- :\r
- String<div class="mdesc"><div class="short">Returns the value of an attribute from the element's underlying DOM node.</div><div class="long">Returns the value of an attribute from the element's underlying DOM node.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>name</code> : String<div class="sub-desc">The attribute name</div></li><li><code>namespace</code> : String<div class="sub-desc">(optional) The namespace in which to look for the attribute</div></li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">The attribute value</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAttribute" ext:member="#getAttribute" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAttributeNS"></a><b><a href="source/Element.html#method-Ext.Element-getAttributeNS">getAttributeNS</a></b>( <code>String namespace</code>, <code>String name</code> )\r
- :\r
- String<div class="mdesc"><div class="short">Returns the value of a namespaced attribute from the element's underlying DOM node.</div><div class="long">Returns the value of a namespaced attribute from the element's underlying DOM node.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>namespace</code> : String<div class="sub-desc">The namespace in which to look for the attribute</div></li><li><code>name</code> : String<div class="sub-desc">The attribute name</div></li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">The attribute value</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAttributeNS" ext:member="#getAttributeNS" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getBorderWidth"></a><b><a href="source/Element.style.html#method-Ext.Element-getBorderWidth">getBorderWidth</a></b>( <code>String side</code> )\r
- :\r
+to use css style <tt>'display:none;'</tt> to hide the Layer.</div></td><td class="msource">Layer</td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Layer-zindex"></a><b><a href="source/Layer.html#cfg-Ext.Layer-zindex">zindex</a></b> : Number<div class="mdesc">Starting z-index (defaults to 11000)</div></td><td class="msource">Layer</td></tr></tbody></table><a id="Ext.Layer-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 inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-DISPLAY"></a><b><a href="source/Element.fx.html#prop-Ext.Element-DISPLAY">DISPLAY</a></b> : Number<div class="mdesc">Visibility mode constant for use with <a href="output/Ext.Element.html#Ext.Element-setVisibilityMode" ext:member="setVisibilityMode" ext:cls="Ext.Element">setVisibilityMode</a>. Use display to hide element</div></td><td class="msource"><a href="output/Ext.Element.html#DISPLAY" ext:member="#DISPLAY" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-VISIBILITY"></a><b><a href="source/Element.fx.html#prop-Ext.Element-VISIBILITY">VISIBILITY</a></b> : Number<div class="mdesc">Visibility mode constant for use with <a href="output/Ext.Element.html#Ext.Element-setVisibilityMode" ext:member="setVisibilityMode" ext:cls="Ext.Element">setVisibilityMode</a>. Use visibility to hide element</div></td><td class="msource"><a href="output/Ext.Element.html#VISIBILITY" ext:member="#VISIBILITY" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-autoBoxAdjust"></a><b><a href="source/Element.html#prop-Ext.Element-autoBoxAdjust">autoBoxAdjust</a></b> : Object<div class="mdesc">true to automatically adjust width and height settings for box-model issues (default to true)</div></td><td class="msource"><a href="output/Ext.Element.html#autoBoxAdjust" ext:member="#autoBoxAdjust" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-defaultUnit"></a><b><a href="source/Element.html#prop-Ext.Element-defaultUnit">defaultUnit</a></b> : String<div class="mdesc">The default unit to append to CSS values where a unit isn't provided (defaults to px).</div></td><td class="msource"><a href="output/Ext.Element.html#defaultUnit" ext:member="#defaultUnit" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-dom"></a><b><a href="source/Element.html#prop-Ext.Element-dom">dom</a></b> : HTMLElement<div class="mdesc">The DOM element</div></td><td class="msource"><a href="output/Ext.Element.html#dom" ext:member="#dom" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-id"></a><b><a href="source/Element.html#prop-Ext.Element-id">id</a></b> : String<div class="mdesc">The DOM element ID</div></td><td class="msource"><a href="output/Ext.Element.html#id" ext:member="#id" ext:cls="Ext.Element">Element</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-originalDisplay"></a><b><a href="source/Element.fx.html#prop-Ext.Element-originalDisplay">originalDisplay</a></b> : String<div class="mdesc">The element's default display mode (defaults to "")</div></td><td class="msource"><a href="output/Ext.Element.html#originalDisplay" ext:member="#originalDisplay" ext:cls="Ext.Element">Element</a></td></tr></tbody></table><a id="Ext.Layer-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"> </a></td><td class="sig"><a id="Ext.Layer-Layer"></a><b><a href="source/Layer.html#cls-Ext.Layer">Layer</a></b>( <code>Object config</code>, <span title="Optional" class="optional">[<code>String/HTMLElement existingEl</code>]</span> )
+ <div class="mdesc"><div class="short"></div><div class="long"><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">An object with config options.</div></li><li><code>existingEl</code> : String/HTMLElement<div class="sub-desc">(optional) Uses an existing DOM element. If the element is not found it creates it.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Layer</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClass"></a><b><a href="source/Element.style.html#method-Ext.Element-addClass">addClass</a></b>( <code>String/Array className</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.</div><div class="long">Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String/Array<div class="sub-desc">The CSS class to add, or an array of classes</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClass" ext:member="#addClass" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClassOnClick"></a><b><a href="source/Element.style-more.html#method-Ext.Element-addClassOnClick">addClassOnClick</a></b>( <code>String className</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effe...</div><div class="long">Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effect)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClassOnClick" ext:member="#addClassOnClick" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClassOnFocus"></a><b><a href="source/Element.style-more.html#method-Ext.Element-addClassOnFocus">addClassOnFocus</a></b>( <code>String className</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Sets up event handlers to add and remove a css class when this element has the focus</div><div class="long">Sets up event handlers to add and remove a css class when this element has the focus<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClassOnFocus" ext:member="#addClassOnFocus" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addClassOnOver"></a><b><a href="source/Element.style-more.html#method-Ext.Element-addClassOnOver">addClassOnOver</a></b>( <code>String className</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Sets up event handlers to add and remove a css class when the mouse is over this element</div><div class="long">Sets up event handlers to add and remove a css class when the mouse is over this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>className</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addClassOnOver" ext:member="#addClassOnOver" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addKeyListener"></a><b><a href="source/Element.keys.html#method-Ext.Element-addKeyListener">addKeyListener</a></b>( <code>Number/Array/Object/String key</code>, <code>Function fn</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span> )
+ :
+ Ext.KeyMap<div class="mdesc"><div class="short">Convenience method for constructing a KeyMap</div><div class="long">Convenience method for constructing a KeyMap<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>key</code> : Number/Array/Object/String<div class="sub-desc">Either a string with the keys to listen for, the numeric key code, array of key codes or an object with the following options:
+<code>{key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}</code></div></li><li><code>fn</code> : Function<div class="sub-desc">The function to call</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<code>this</code> reference) in which the specified function is executed. Defaults to this Element.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.KeyMap</code><div class="sub-desc">The KeyMap created</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addKeyListener" ext:member="#addKeyListener" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addKeyMap"></a><b><a href="source/Element.keys.html#method-Ext.Element-addKeyMap">addKeyMap</a></b>( <code>Object config</code> )
+ :
+ Ext.KeyMap<div class="mdesc"><div class="short">Creates a KeyMap for this element</div><div class="long">Creates a KeyMap for this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">The KeyMap config. See <a href="output/Ext.KeyMap.html" ext:cls="Ext.KeyMap">Ext.KeyMap</a> for more details</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.KeyMap</code><div class="sub-desc">The KeyMap created</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addKeyMap" ext:member="#addKeyMap" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-addListener"></a><b><a href="source/Element.html#method-Ext.Element-addListener">addListener</a></b>( <code>String eventName</code>, <code>Function fn</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span>, <span title="Optional" class="optional">[<code>Object options</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Appends an event handler to this element. The shorthand version on is equivalent.</div><div class="long">Appends an event handler to this element. The shorthand version <a href="output/Ext.Element.html#Ext.Element-on" ext:member="on" ext:cls="Ext.Element">on</a> is equivalent.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The name of event to handle.</div></li><li><code>fn</code> : Function<div class="sub-desc">The handler function the event invokes. This function is passed
+the following parameters:<ul>
+<li><b>evt</b> : EventObject<div class="sub-desc">The <a href="output/Ext.EventObject.html" ext:cls="Ext.EventObject">EventObject</a> describing the event.</div></li>
+<li><b>el</b> : HtmlElement<div class="sub-desc">The DOM element which was the target of the event.
+Note that this may be filtered by using the <tt>delegate</tt> option.</div></li>
+<li><b>o</b> : Object<div class="sub-desc">The options object from the addListener call.</div></li>
+</ul></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 this Element.</b>.</div></li><li><code>options</code> : Object<div class="sub-desc">(optional) An object containing handler configuration properties.
+This may contain any of the following properties:<ul>
+<li><b>scope</b> Object : <div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+<b>If omitted, defaults to this Element.</b></div></li>
+<li><b>delegate</b> String: <div class="sub-desc">A simple selector to filter the target or look for a descendant of the target. See below for additional details.</div></li>
+<li><b>stopEvent</b> Boolean: <div class="sub-desc">True to stop the event. That is stop propagation, and prevent the default action.</div></li>
+<li><b>preventDefault</b> Boolean: <div class="sub-desc">True to prevent the default action</div></li>
+<li><b>stopPropagation</b> Boolean: <div class="sub-desc">True to prevent event propagation</div></li>
+<li><b>normalized</b> Boolean: <div class="sub-desc">False to pass a browser event to the handler function instead of an Ext.EventObject</div></li>
+<li><b>target</b> Ext.Element: <div class="sub-desc">Only call the handler if the event was fired on the target Element, <i>not</i> if the event was bubbled up from a child node.</div></li>
+<li><b>delay</b> Number: <div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+<li><b>single</b> Boolean: <div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+<li><b>buffer</b> Number: <div class="sub-desc">Causes the handler to be scheduled to run in an <a href="output/Ext.util.DelayedTask.html" ext:cls="Ext.util.DelayedTask">Ext.util.DelayedTask</a> delayed
+by the specified number of milliseconds. If the event fires again within that time, the original
+handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+</ul><br>
+<p>
+<b>Combining Options</b><br>
+In the following examples, the shorthand form <a href="output/Ext.Element.html#Ext.Element-on" ext:member="on" ext:cls="Ext.Element">on</a> is used rather than the more verbose
+addListener. The two are equivalent. Using the options argument, it is possible to combine different
+types of listeners:<br>
+<br>
+A delayed, one-time listener that auto stops the event and adds a custom argument (forumId) to the
+options object. The options object is available as the third parameter in the handler function.<div style="margin: 5px 20px 20px;">
+Code:<pre><code>el.on(<em>'click'</em>, this.onClick, this, {
+ single: true,
+ delay: 100,
+ stopEvent : true,
+ forumId: 4
+});</code></pre></p>
+<p>
+<b>Attaching multiple handlers in 1 call</b><br>
+The method also allows for a single argument to be passed which is a config object containing properties
+which specify multiple handlers.</p>
+<p>
+Code:<pre><code>el.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
+ }
+});</code></pre>
+<p>
+Or a shorthand syntax:<br>
+Code:<pre><code></p>
+el.on({
+ <em>'click'</em> : this.onClick,
+ <em>'mouseover'</em> : this.onMouseOver,
+ <em>'mouseout'</em> : this.onMouseOut,
+ scope: this
+});</code></pre></p>
+<p><b>delegate</b></p>
+<p>This is a configuration option that you can pass along when registering a handler for
+an event to assist with event delegation. Event delegation is a technique that is used to
+reduce memory consumption and prevent exposure to memory-leaks. By registering an event
+for a container element as opposed to each element within a container. By setting this
+configuration option to a simple selector, the target element will be filtered to look for
+a descendant of the target.
+For example:<pre><code><i>// using this markup:</i>
+<div id=<em>'elId'</em>>
+ <p id=<em>'p1'</em>>paragraph one</p>
+ <p id=<em>'p2'</em> class=<em>'clickable'</em>>paragraph two</p>
+ <p id=<em>'p3'</em>>paragraph three</p>
+</div>
+<i>// utilize event delegation to registering just one handler on the container element:</i>
+el = Ext.get(<em>'elId'</em>);
+el.on(
+ <em>'click'</em>,
+ <b>function</b>(e,t) {
+ <i>// handle click</i>
+ console.info(t.id); <i>// <em>'p2'</em></i>
+ },
+ this,
+ {
+ <i>// filter the target element to be a descendant <b>with</b> the class <em>'clickable'</em></i>
+ delegate: <em>'.clickable'</em>
+ }
+);</code></pre></p></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#addListener" ext:member="#addListener" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-alignTo"></a><b><a href="source/Element.alignment.html#method-Ext.Element-alignTo">alignTo</a></b>( <code>Mixed element</code>, <code>String position</code>, <span title="Optional" class="optional">[<code>Array offsets</code>]</span>, <span title="Optional" class="optional">[<code>Boolean/Object animate</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Aligns this element with another element relative to the specified anchor points. If the other element is the
+documen...</div><div class="long">Aligns this element with another element relative to the specified anchor points. If the other element is the
+document it aligns it to the viewport.
+The position parameter is optional, and can be specified in any one of the following formats:
+<ul>
+<li><b>Blank</b>: Defaults to aligning the element's top-left corner to the target's bottom-left corner ("tl-bl").</li>
+<li><b>One anchor (deprecated)</b>: The passed anchor position is used as the target element's anchor point.
+The element being aligned will position its top-left corner (tl) to that point. <i>This method has been
+deprecated in favor of the newer two anchor syntax below</i>.</li>
+<li><b>Two anchors</b>: If two values from the table below are passed separated by a dash, the first value is used as the
+element's anchor point, and the second value is used as the target's anchor point.</li>
+</ul>
+In addition to the anchor points, the position parameter also supports the "?" character. If "?" is passed at the end of
+the position string, the element will attempt to align as specified, but the position will be adjusted to constrain to
+the viewport if necessary. Note that the element being aligned might be swapped to align to a different position than
+that specified in order to enforce the viewport constraints.
+Following are all of the supported anchor positions:
+<pre>
+Value Description
+----- -----------------------------
+tl The top left corner (default)
+t The center of the top edge
+tr The top right corner
+l The center of the left edge
+c In the center of the element
+r The center of the right edge
+bl The bottom left corner
+b The center of the bottom edge
+br The bottom right corner
+</pre>
+Example Usage:
+<pre><code><i>// align el to other-el using the <b>default</b> positioning (<em>"tl-bl"</em>, non-constrained)</i>
+el.alignTo(<em>"other-el"</em>);
+
+<i>// align the top left corner of el <b>with</b> the top right corner of other-el (constrained to viewport)</i>
+el.alignTo(<em>"other-el"</em>, <em>"tr?"</em>);
+
+<i>// align the bottom right corner of el <b>with</b> the center left edge of other-el</i>
+el.alignTo(<em>"other-el"</em>, <em>"br-l?"</em>);
+
+<i>// align the center of el <b>with</b> the bottom left corner of other-el and</i>
+<i>// adjust the x position by -6 pixels (and the y position by 0)</i>
+el.alignTo(<em>"other-el"</em>, <em>"c-bl"</em>, [-6, 0]);</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to.</div></li><li><code>position</code> : String<div class="sub-desc">(optional, defaults to "tl-bl?") The position to align to.</div></li><li><code>offsets</code> : Array<div class="sub-desc">(optional) Offset the positioning by [x, y]</div></li><li><code>animate</code> : Boolean/Object<div class="sub-desc">(optional) true for the default animation or a standard Element animation config object</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#alignTo" ext:member="#alignTo" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-anchorTo"></a><b><a href="source/Element.alignment.html#method-Ext.Element-anchorTo">anchorTo</a></b>( <code>Mixed element</code>, <code>String position</code>, <span title="Optional" class="optional">[<code>Array offsets</code>]</span>, <span title="Optional" class="optional">[<code>Boolean/Object animate</code>]</span>, <span title="Optional" class="optional">[<code>Boolean/Number monitorScroll</code>]</span>, <code>Function callback</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Anchors an element to another element and realigns it when the window is resized.</div><div class="long">Anchors an element to another element and realigns it when the window is resized.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to.</div></li><li><code>position</code> : String<div class="sub-desc">The position to align to.</div></li><li><code>offsets</code> : Array<div class="sub-desc">(optional) Offset the positioning by [x, y]</div></li><li><code>animate</code> : Boolean/Object<div class="sub-desc">(optional) True for the default animation or a standard Element animation config object</div></li><li><code>monitorScroll</code> : Boolean/Number<div class="sub-desc">(optional) True to monitor body scroll and reposition. If this parameter
+is a number, it is used as the buffer delay (defaults to 50ms).</div></li><li><code>callback</code> : Function<div class="sub-desc">The function to call after the animation finishes</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#anchorTo" ext:member="#anchorTo" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-animate"></a><b><a href="source/Element.fx.html#method-Ext.Element-animate">animate</a></b>( <code>Object args</code>, <span title="Optional" class="optional">[<code>Float duration</code>]</span>, <span title="Optional" class="optional">[<code>Function onComplete</code>]</span>, <span title="Optional" class="optional">[<code>String easing</code>]</span>, <span title="Optional" class="optional">[<code>String animType</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Perform custom animation on this element.
+<ul class="mdetail-params">
+Animation Properties
+The Animation Control Obje...</div><div class="long">Perform custom animation on this element.
+<div><ul class="mdetail-params">
+<li><u>Animation Properties</u></li>
+<p>The Animation Control Object enables gradual transitions for any member of an
+element's style object that takes a numeric value including but not limited to
+these properties:</p><div><ul class="mdetail-params">
+<li><tt>bottom, top, left, right</tt></li>
+<li><tt>height, width</tt></li>
+<li><tt>margin, padding</tt></li>
+<li><tt>borderWidth</tt></li>
+<li><tt>opacity</tt></li>
+<li><tt>fontSize</tt></li>
+<li><tt>lineHeight</tt></li>
+</ul></div>
+<li><u>Animation Property Attributes</u></li>
+<p>Each Animation Property is a config object with optional properties:</p>
+<div><ul class="mdetail-params">
+<li><tt>by</tt>* : relative change - start at current value, change by this value</li>
+<li><tt>from</tt> : ignore current value, start from this value</li>
+<li><tt>to</tt>* : start at current value, go to this value</li>
+<li><tt>unit</tt> : any allowable unit specification</li>
+<p>* do not specify both <tt>to</tt> and <tt>by</tt> for an animation property</p>
+</ul></div>
+<li><u>Animation Types</u></li>
+<p>The supported animation types:</p><div><ul class="mdetail-params">
+<li><tt>'run'</tt> : Default
+<pre><code><b>var</b> el = Ext.get(<em>'complexEl'</em>);
+el.animate(
+ <i>// animation control object</i>
+ {
+ borderWidth: {to: 3, from: 0},
+ opacity: {to: .3, from: 1},
+ height: {to: 50, from: el.getHeight()},
+ width: {to: 300, from: el.getWidth()},
+ top : {by: - 100, unit: <em>'px'</em>},
+ },
+ 0.35, <i>// animation duration</i>
+ null, <i>// callback</i>
+ <em>'easeOut'</em>, <i>// easing method</i>
+ <em>'run'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>)</i>
+);</code></pre>
+</li>
+<li><tt>'color'</tt>
+<p>Animates transition of background, text, or border colors.</p>
+<pre><code>el.animate(
+ <i>// animation control object</i>
+ {
+ color: { to: <em>'#06e'</em> },
+ backgroundColor: { to: <em>'#e06'</em> }
+ },
+ 0.35, <i>// animation duration</i>
+ null, <i>// callback</i>
+ <em>'easeOut'</em>, <i>// easing method</i>
+ <em>'color'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>)</i>
+);</code></pre>
+</li>
+<li><tt>'motion'</tt>
+<p>Animates the motion of an element to/from specific points using optional bezier
+way points during transit.</p>
+<pre><code>el.animate(
+ <i>// animation control object</i>
+ {
+ borderWidth: {to: 3, from: 0},
+ opacity: {to: .3, from: 1},
+ height: {to: 50, from: el.getHeight()},
+ width: {to: 300, from: el.getWidth()},
+ top : {by: - 100, unit: <em>'px'</em>},
+ points: {
+ to: [50, 100], <i>// go to this point</i>
+ control: [ <i>// optional bezier way points</i>
+ [ 600, 800],
+ [-100, 200]
+ ]
+ }
+ },
+ 3000, <i>// animation duration (milliseconds!)</i>
+ null, <i>// callback</i>
+ <em>'easeOut'</em>, <i>// easing method</i>
+ <em>'motion'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>)</i>
+);</code></pre>
+</li>
+<li><tt>'scroll'</tt>
+<p>Animate horizontal or vertical scrolling of an overflowing page element.</p>
+<pre><code>el.animate(
+ <i>// animation control object</i>
+ {
+ scroll: {to: [400, 300]}
+ },
+ 0.35, <i>// animation duration</i>
+ null, <i>// callback</i>
+ <em>'easeOut'</em>, <i>// easing method</i>
+ <em>'scroll'</em> <i>// animation type (<em>'run'</em>,<em>'color'</em>,<em>'motion'</em>,<em>'scroll'</em>)</i>
+);</code></pre>
+</li>
+</ul></div>
+</ul></div><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>args</code> : Object<div class="sub-desc">The animation control args</div></li><li><code>duration</code> : Float<div class="sub-desc">(optional) How long the animation lasts in seconds (defaults to <tt>.35</tt>)</div></li><li><code>onComplete</code> : Function<div class="sub-desc">(optional) Function to call when animation completes</div></li><li><code>easing</code> : String<div class="sub-desc">(optional) <a href="output/Ext.Fx.html#Ext.Fx-easing" ext:member="easing" ext:cls="Ext.Fx">Ext.Fx.easing</a> method to use (defaults to <tt>'easeOut'</tt>)</div></li><li><code>animType</code> : String<div class="sub-desc">(optional) <tt>'run'</tt> is the default. Can also be <tt>'color'</tt>,
+<tt>'motion'</tt>, or <tt>'scroll'</tt></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#animate" ext:member="#animate" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-appendChild"></a><b><a href="source/Element.insertion.html#method-Ext.Element-appendChild">appendChild</a></b>( <code>String/HTMLElement/Array/Element/CompositeElement el</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Appends the passed element(s) to this element</div><div class="long">Appends the passed element(s) to this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : String/HTMLElement/Array/Element/CompositeElement<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#appendChild" ext:member="#appendChild" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-appendTo"></a><b><a href="source/Element.insertion.html#method-Ext.Element-appendTo">appendTo</a></b>( <code>Mixed el</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Appends this element to the passed element</div><div class="long">Appends this element to the passed element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : Mixed<div class="sub-desc">The new parent element</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#appendTo" ext:member="#appendTo" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-applyStyles"></a><b><a href="source/Element.style-more.html#method-Ext.Element-applyStyles">applyStyles</a></b>( <code>String/Object/Function styles</code> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">More flexible version of setStyle for setting style properties.</div><div class="long">More flexible version of <a href="output/Ext.Element.html#Ext.Element-setStyle" ext:member="setStyle" ext:cls="Ext.Element">setStyle</a> for setting style properties.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>styles</code> : String/Object/Function<div class="sub-desc">A style specification string, e.g. "width:100px", or object in the form {width:"100px"}, or
+a function which returns such a specification.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#applyStyles" ext:member="#applyStyles" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-autoHeight"></a><b><a href="source/Element.legacy.html#method-Ext.Element-autoHeight">autoHeight</a></b>( <span title="Optional" class="optional">[<code>Boolean animate</code>]</span>, <span title="Optional" class="optional">[<code>Float duration</code>]</span>, <span title="Optional" class="optional">[<code>Function onComplete</code>]</span>, <span title="Optional" class="optional">[<code>String easing</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Measures the element's content height and updates height to match. Note: this function uses setTimeout so
+the new hei...</div><div class="long">Measures the element's content height and updates height to match. Note: this function uses setTimeout so
+the new height may not be available immediately.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>animate</code> : Boolean<div class="sub-desc">(optional) Animate the transition (defaults to false)</div></li><li><code>duration</code> : Float<div class="sub-desc">(optional) Length of the animation in seconds (defaults to .35)</div></li><li><code>onComplete</code> : Function<div class="sub-desc">(optional) Function to call when animation completes</div></li><li><code>easing</code> : String<div class="sub-desc">(optional) Easing method to use (defaults to easeOut)</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#autoHeight" ext:member="#autoHeight" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-blur"></a><b><a href="source/Element.html#method-Ext.Element-blur">blur</a></b>()
+ :
+ Ext.Element<div class="mdesc"><div class="short">Tries to blur the element. Any exceptions are caught and ignored.</div><div class="long">Tries to blur the element. Any exceptions are caught and ignored.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#blur" ext:member="#blur" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-boxWrap"></a><b><a href="source/Element.style-more.html#method-Ext.Element-boxWrap">boxWrap</a></b>( <span title="Optional" class="optional">[<code>String class</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Wraps the specified element with a special 9 element markup/CSS block that renders by default as
+a gray container wit...</div><div class="long"><p>Wraps the specified element with a special 9 element markup/CSS block that renders by default as
+a gray container with a gradient background, rounded corners and a 4-way shadow.</p>
+<p>This special markup is used throughout Ext when box wrapping elements (<a href="output/Ext.Button.html" ext:cls="Ext.Button">Ext.Button</a>,
+<a href="output/Ext.Panel.html" ext:cls="Ext.Panel">Ext.Panel</a> when <tt><a href="output/Ext.Panel.html#Ext.Panel-frame" ext:member="frame" ext:cls="Ext.Panel">frame=true</a></tt>, <a href="output/Ext.Window.html" ext:cls="Ext.Window">Ext.Window</a>). The markup
+is of this form:</p>
+<pre><code>Ext.Element.boxMarkup =
+ '<div class=<em>"{0}-tl"</em>><div class=<em>"{0}-tr"</em>><div class=<em>"{0}-tc"</em>></div></div></div>
+ <div class=<em>"{0}-ml"</em>><div class=<em>"{0}-mr"</em>><div class=<em>"{0}-mc"</em>></div></div></div>
+ <div class=<em>"{0}-bl"</em>><div class=<em>"{0}-br"</em>><div class=<em>"{0}-bc"</em>></div></div></div>';</code></pre>
+<p>Example usage:</p>
+<pre><code><i>// Basic box wrap</i>
+ Ext.get(<em>"foo"</em>).boxWrap();
+
+ <i>// You can also add a custom class and use CSS inheritance rules to customize the box look.</i>
+ <i>// <em>'x-box-blue'</em> is a built-<b>in</b> alternative -- look at the related CSS definitions as an example</i>
+ <i>// <b>for</b> how to create a custom box wrap style.</i>
+ Ext.get(<em>"foo"</em>).boxWrap().addClass(<em>"x-box-blue"</em>);</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>class</code> : String<div class="sub-desc">(optional) A base CSS class to apply to the containing wrapper element
+(defaults to <tt>'x-box'</tt>). Note that there are a number of CSS rules that are dependent on
+this name to make the overall effect work, so if you supply an alternate base class, make sure you
+also supply all of the necessary rules.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The outermost wrapping element of the created box structure.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#boxWrap" ext:member="#boxWrap" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-center"></a><b><a href="source/Element.alignment.html#method-Ext.Element-center">center</a></b>( <span title="Optional" class="optional">[<code>Mixed centerIn</code>]</span> )
+ :
+ void<div class="mdesc"><div class="short">Centers the Element in either the viewport, or another Element.</div><div class="long">Centers the Element in either the viewport, or another Element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>centerIn</code> : Mixed<div class="sub-desc">(optional) The element in which to center the element.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#center" ext:member="#center" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-child"></a><b><a href="source/Element.traversal.html#method-Ext.Element-child">child</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )
+ :
+ HTMLElement/Ext.Element<div class="mdesc"><div class="short">Selects a single child at any depth below this element based on the passed CSS selector (the selector should not cont...</div><div class="long">Selects a single child at any depth below this element based on the passed CSS selector (the selector should not contain an id).<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The CSS selector</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) True to return the DOM node instead of Ext.Element (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement/Ext.Element</code><div class="sub-desc">The child Ext.Element (or DOM node if returnDom = true)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#child" ext:member="#child" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clean"></a><b><a href="source/Element-more.html#method-Ext.Element-clean">clean</a></b>( <span title="Optional" class="optional">[<code>Boolean forceReclean</code>]</span> )
+ :
+ void<div class="mdesc"><div class="short">Removes worthless text nodes</div><div class="long">Removes worthless text nodes<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>forceReclean</code> : Boolean<div class="sub-desc">(optional) By default the element
+keeps track if it has been cleaned already so
+you can call this over and over. However, if you update the element and
+need to force a reclean, you can pass true.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clean" ext:member="#clean" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clearOpacity"></a><b><a href="source/Element.style.html#method-Ext.Element-clearOpacity">clearOpacity</a></b>()
+ :
+ Ext.Element<div class="mdesc"><div class="short">Clears any opacity settings from this element. Required in some cases for IE.</div><div class="long">Clears any opacity settings from this element. Required in some cases for IE.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clearOpacity" ext:member="#clearOpacity" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clearPositioning"></a><b><a href="source/Element.position.html#method-Ext.Element-clearPositioning">clearPositioning</a></b>( <span title="Optional" class="optional">[<code>String value</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Clear positioning back to the default when the document was loaded</div><div class="long">Clear positioning back to the default when the document was loaded<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>value</code> : String<div class="sub-desc">(optional) The value to use for the left,right,top,bottom, defaults to '' (empty string). You could use 'auto'.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clearPositioning" ext:member="#clearPositioning" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-clip"></a><b><a href="source/Element.style.html#method-Ext.Element-clip">clip</a></b>()
+ :
+ Ext.Element<div class="mdesc"><div class="short">Store the current overflow setting and clip overflow on the element - use unclip to remove</div><div class="long">Store the current overflow setting and clip overflow on the element - use <tt><a href="output/Ext.Element.html#Ext.Element-unclip" ext:member="unclip" ext:cls="Ext.Element">unclip</a></tt> to remove<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#clip" ext:member="#clip" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-contains"></a><b><a href="source/Element.html#method-Ext.Element-contains">contains</a></b>( <code>HTMLElement/String el</code> )
+ :
+ Boolean<div class="mdesc"><div class="short">Returns true if this element is an ancestor of the passed element</div><div class="long">Returns true if this element is an ancestor of the passed element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : HTMLElement/String<div class="sub-desc">The element to check</div></li></ul><strong>Returns:</strong><ul><li><code>Boolean</code><div class="sub-desc">True if this element is an ancestor of el, else false</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#contains" ext:member="#contains" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-createChild"></a><b><a href="source/Element.insertion.html#method-Ext.Element-createChild">createChild</a></b>( <code>Object config</code>, <span title="Optional" class="optional">[<code>HTMLElement insertBefore</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child e...</div><div class="long">Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">DomHelper element config object. If no tag is specified (e.g., {tag:'input'}) then a div will be
+automatically generated with the specified attributes.</div></li><li><code>insertBefore</code> : HTMLElement<div class="sub-desc">(optional) a child element of this element</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) true to return the dom node instead of creating an Element</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The new child element</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#createChild" ext:member="#createChild" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-createProxy"></a><b><a href="source/Element-more.html#method-Ext.Element-createProxy">createProxy</a></b>( <code>String/Object config</code>, <span title="Optional" class="optional">[<code>String/HTMLElement renderTo</code>]</span>, <span title="Optional" class="optional">[<code>Boolean matchBox</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Creates a proxy element of this element</div><div class="long">Creates a proxy element of this element<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : String/Object<div class="sub-desc">The class name of the proxy element or a DomHelper config object</div></li><li><code>renderTo</code> : String/HTMLElement<div class="sub-desc">(optional) The element or element id to render the proxy to (defaults to document.body)</div></li><li><code>matchBox</code> : Boolean<div class="sub-desc">(optional) True to align and size the proxy to this element now (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The new proxy element</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#createProxy" ext:member="#createProxy" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-createShim"></a><b><a href="source/Element.fx-more.html#method-Ext.Element-createShim">createShim</a></b>()
+ :
+ Ext.Element<div class="mdesc"><div class="short">Creates an iframe shim for this element to keep selects and other windowed objects from
+showing through.</div><div class="long">Creates an iframe shim for this element to keep selects and other windowed objects from
+showing through.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The new shim element</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#createShim" ext:member="#createShim" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-down"></a><b><a href="source/Element.traversal.html#method-Ext.Element-down">down</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )
+ :
+ HTMLElement/Ext.Element<div class="mdesc"><div class="short">Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).</div><div class="long">Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The CSS selector</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) True to return the DOM node instead of Ext.Element (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement/Ext.Element</code><div class="sub-desc">The child Ext.Element (or DOM node if returnDom = true)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#down" ext:member="#down" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-enableDisplayMode"></a><b><a href="source/Element.fx-more.html#method-Ext.Element-enableDisplayMode">enableDisplayMode</a></b>( <span title="Optional" class="optional">[<code>String display</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Convenience method for setVisibilityMode(Element.DISPLAY)</div><div class="long">Convenience method for setVisibilityMode(Element.DISPLAY)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>display</code> : String<div class="sub-desc">(optional) What to set display to when visible</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#enableDisplayMode" ext:member="#enableDisplayMode" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-findParent"></a><b><a href="source/Element.traversal.html#method-Ext.Element-findParent">findParent</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Number/Mixed maxDepth</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnEl</code>]</span> )
+ :
+ HTMLElement<div class="mdesc"><div class="short">Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:fi...</div><div class="long">Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The simple selector to test</div></li><li><code>maxDepth</code> : Number/Mixed<div class="sub-desc">(optional) The max depth to search as a number or element (defaults to 50 || document.body)</div></li><li><code>returnEl</code> : Boolean<div class="sub-desc">(optional) True to return a Ext.Element object instead of DOM node</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement</code><div class="sub-desc">The matching DOM node (or null if no match was found)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#findParent" ext:member="#findParent" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-findParentNode"></a><b><a href="source/Element.traversal.html#method-Ext.Element-findParentNode">findParentNode</a></b>( <code>String selector</code>, <span title="Optional" class="optional">[<code>Number/Mixed maxDepth</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnEl</code>]</span> )
+ :
+ HTMLElement<div class="mdesc"><div class="short">Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)</div><div class="long">Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">The simple selector to test</div></li><li><code>maxDepth</code> : Number/Mixed<div class="sub-desc">(optional) The max depth to
+ search as a number or element (defaults to 10 || document.body)</div></li><li><code>returnEl</code> : Boolean<div class="sub-desc">(optional) True to return a Ext.Element object instead of DOM node</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement</code><div class="sub-desc">The matching DOM node (or null if no match was found)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#findParentNode" ext:member="#findParentNode" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-first"></a><b><a href="source/Element.traversal.html#method-Ext.Element-first">first</a></b>( <span title="Optional" class="optional">[<code>String selector</code>]</span>, <span title="Optional" class="optional">[<code>Boolean returnDom</code>]</span> )
+ :
+ Ext.Element/HTMLElement<div class="mdesc"><div class="short">Gets the first child, skipping text nodes</div><div class="long">Gets the first child, skipping text nodes<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selector</code> : String<div class="sub-desc">(optional) Find the next sibling that matches the passed simple selector</div></li><li><code>returnDom</code> : Boolean<div class="sub-desc">(optional) True to return a raw dom node instead of an Ext.Element</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element/HTMLElement</code><div class="sub-desc">The first child or null</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#first" ext:member="#first" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-fly"></a><b><a href="source/Element.html#method-Ext.Element-fly">fly</a></b>( <code>String/HTMLElement el</code>, <span title="Optional" class="optional">[<code>String named</code>]</span> )
+ :
+ Element<div class="mdesc"><div class="short">Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to t...</div><div class="long"><p>Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
+the dom node can be overwritten by other code. Shorthand of <a href="output/Ext.Element.html#Ext.Element-fly" ext:member="fly" ext:cls="Ext.Element">Ext.Element.fly</a></p>
+<p>Use this to make one-time references to DOM elements which are not going to be accessed again either by
+application code, or by Ext's classes. If accessing an element which will be processed regularly, then <a href="output/Ext.html#Ext-get" ext:member="get" ext:cls="Ext">Ext.get</a>
+will be more appropriate to take advantage of the caching provided by the Ext.Element class.</p><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : String/HTMLElement<div class="sub-desc">The dom node or id</div></li><li><code>named</code> : String<div class="sub-desc">(optional) Allows for creation of named reusable flyweights to prevent conflicts
+(e.g. internally Ext uses "_global")</div></li></ul><strong>Returns:</strong><ul><li><code>Element</code><div class="sub-desc">The shared Element object (or null if no matching element was found)</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#fly" ext:member="#fly" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-focus"></a><b><a href="source/Element.html#method-Ext.Element-focus">focus</a></b>( <span title="Optional" class="optional">[<code>Number defer</code>]</span> )
+ :
+ Ext.Element<div class="mdesc"><div class="short">Tries to focus the element. Any exceptions are caught and ignored.</div><div class="long">Tries to focus the element. Any exceptions are caught and ignored.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>defer</code> : Number<div class="sub-desc">(optional) Milliseconds to defer the focus</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#focus" ext:member="#focus" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAlignToXY"></a><b><a href="source/Element.alignment.html#method-Ext.Element-getAlignToXY">getAlignToXY</a></b>( <code>Mixed element</code>, <code>String position</code>, <span title="Optional" class="optional">[<code>Array offsets</code>]</span> )
+ :
+ Array<div class="mdesc"><div class="short">Gets the x,y coordinates to align this element with another element. See alignTo for more info on the
+supported posit...</div><div class="long">Gets the x,y coordinates to align this element with another element. See <a href="output/Ext.Element.html#Ext.Element-alignTo" ext:member="alignTo" ext:cls="Ext.Element">alignTo</a> for more info on the
+supported position values.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to.</div></li><li><code>position</code> : String<div class="sub-desc">(optional, defaults to "tl-bl?") The position to align to.</div></li><li><code>offsets</code> : Array<div class="sub-desc">(optional) Offset the positioning by [x, y]</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">[x, y]</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAlignToXY" ext:member="#getAlignToXY" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAnchorXY"></a><b><a href="source/Element.alignment.html#method-Ext.Element-getAnchorXY">getAnchorXY</a></b>( <span title="Optional" class="optional">[<code>String anchor</code>]</span>, <span title="Optional" class="optional">[<code>Boolean local</code>]</span>, <span title="Optional" class="optional">[<code>Object size</code>]</span> )
+ :
+ Array<div class="mdesc"><div class="short">Gets the x,y coordinates specified by the anchor position on the element.</div><div class="long">Gets the x,y coordinates specified by the anchor position on the element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>anchor</code> : String<div class="sub-desc">(optional) The specified anchor position (defaults to "c"). See <a href="output/Ext.Element.html#Ext.Element-alignTo" ext:member="alignTo" ext:cls="Ext.Element">alignTo</a>
+for details on supported anchor positions.</div></li><li><code>local</code> : Boolean<div class="sub-desc">(optional) True to get the local (element top/left-relative) anchor position instead
+of page coordinates</div></li><li><code>size</code> : Object<div class="sub-desc">(optional) An object containing the size to use for calculating anchor position
+{width: (target width), height: (target height)} (defaults to the element's current size)</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">[x, y] An array containing the element's x and y coordinates</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAnchorXY" ext:member="#getAnchorXY" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAttribute"></a><b><a href="source/Element.html#method-Ext.Element-getAttribute">getAttribute</a></b>( <code>String name</code>, <span title="Optional" class="optional">[<code>String namespace</code>]</span> )
+ :
+ String<div class="mdesc"><div class="short">Returns the value of an attribute from the element's underlying DOM node.</div><div class="long">Returns the value of an attribute from the element's underlying DOM node.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>name</code> : String<div class="sub-desc">The attribute name</div></li><li><code>namespace</code> : String<div class="sub-desc">(optional) The namespace in which to look for the attribute</div></li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">The attribute value</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAttribute" ext:member="#getAttribute" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getAttributeNS"></a><b><a href="source/Element.html#method-Ext.Element-getAttributeNS">getAttributeNS</a></b>( <code>String namespace</code>, <code>String name</code> )
+ :
+ String<div class="mdesc"><div class="short">Returns the value of a namespaced attribute from the element's underlying DOM node.</div><div class="long">Returns the value of a namespaced attribute from the element's underlying DOM node.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>namespace</code> : String<div class="sub-desc">The namespace in which to look for the attribute</div></li><li><code>name</code> : String<div class="sub-desc">The attribute name</div></li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">The attribute value</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Element.html#getAttributeNS" ext:member="#getAttributeNS" ext:cls="Ext.Element">Element</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Element-getBorderWidth"></a><b><a href="source/Element.style.html#method-Ext.Element-getBorderWidth">getBorderWidth</a></b>( <code>String side</code> )
+ :