X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/25ef3491bd9ae007ff1fc2b0d7943e6eaaccf775..6e39d509471fe9b4e2660e0d1631b350d0c66f40:/docs/output/Ext.Element.html diff --git a/docs/output/Ext.Element.html b/docs/output/Ext.Element.html index 46acb55c..97d9e08b 100644 --- a/docs/output/Ext.Element.html +++ b/docs/output/Ext.Element.html @@ -1,53 +1,53 @@ -
Properties Methods Events Direct Link

Class Ext.Element

Package:Ext
Defined In:Element.fx.js, Element.insertion.js, Element.js, Element.position.js, Element.scroll.js, Element.style.js, Element.traversal.js, Element-more.js, Element.alignment.js, Element.dd.js, Element.fx-more.js, Element.insertion-more.js, Element.keys.js, Element.legacy.js, Element.position-more.js, Element.scroll-more.js, Element.style-more.js
Class:Element
Subclasses:Layer
Extends:Object

Encapsulates a DOM element, adding simple DOM manipulation facilities, normalizing for browser differences.

-

All instances of this class inherit the methods of Ext.Fx making visual effects easily available to all DOM elements.

-

Note that the events documented in this class are not Ext events, they encapsulate browser events. To -access the underlying browser event, see Ext.EventObject.browserEvent. Some older -browsers may not support the full range of events. Which events are supported is beyond the control of ExtJs.

-Usage:
-
// by id

-var el = Ext.get("my-div");
-
-// by DOM element reference

-var el = Ext.get(myDivElement);
-Animations
-

When an element is manipulated, by default there is no animation.

-
var el = Ext.get("my-div");
-
-// no animation

-el.setWidth(100);
-

Many of the functions for manipulating an element have an optional "animate" parameter. This -parameter can be specified as boolean (true) for default animation effects.

-
// default animation

-el.setWidth(100, true);
-

To configure the effects, an object literal with animation options to use as the Element animation -configuration object can also be specified. Note that the supported Element animation configuration -options are a subset of the Ext.Fx animation options specific to Fx effects. The supported -Element animation configuration options are:

-
-Option    Default   Description
---------- --------  ---------------------------------------------
-duration  .35       The duration of the animation in seconds
-easing    easeOut   The easing method
-callback  none      A function to execute when the anim completes
-scope     this      The scope (this) of the callback function
-
-
// Element animation options object

-var opt = {
-    duration: 1,
-    easing: 'elasticIn',
-    callback: this.foo,
-    scope: this
-};
-// animation with some options set

-el.setWidth(100, opt);
-

The Element animation object being used for the animation will be set on the options -object as "anim", which allows you to stop or manipulate the animation. Here is an example:

-
// using the "anim" property to get the Anim object

-if(opt.anim.isAnimated()){
-    opt.anim.stop();
-}
-

Also see the animate method for another animation technique.

-

Composite (Collections of) Elements

+

Class Ext.Element

Package:Ext
Defined In:Element.fx.js, Element.insertion.js, Element.js, Element.position.js, Element.scroll.js, Element.style.js, Element.traversal.js, Element-more.js, Element.alignment.js, Element.dd.js, Element.fx-more.js, Element.insertion-more.js, Element.keys.js, Element.legacy.js, Element.position-more.js, Element.scroll-more.js, Element.style-more.js, Element.traversal-more.js
Class:Element
Subclasses:Layer
Extends:Object

Encapsulates a DOM element, adding simple DOM manipulation facilities, normalizing for browser differences.

+

All instances of this class inherit the methods of Ext.Fx making visual effects easily available to all DOM elements.

+

Note that the events documented in this class are not Ext events, they encapsulate browser events. To +access the underlying browser event, see Ext.EventObject.browserEvent. Some older +browsers may not support the full range of events. Which events are supported is beyond the control of ExtJs.

+Usage:
+
// by id
+var el = Ext.get("my-div");
+
+// by DOM element reference
+var el = Ext.get(myDivElement);
+Animations
+

When an element is manipulated, by default there is no animation.

+
var el = Ext.get("my-div");
+
+// no animation
+el.setWidth(100);
+

Many of the functions for manipulating an element have an optional "animate" parameter. This +parameter can be specified as boolean (true) for default animation effects.

+
// default animation
+el.setWidth(100, true);
+

To configure the effects, an object literal with animation options to use as the Element animation +configuration object can also be specified. Note that the supported Element animation configuration +options are a subset of the Ext.Fx animation options specific to Fx effects. The supported +Element animation configuration options are:

+
+Option    Default   Description
+--------- --------  ---------------------------------------------
+duration  .35       The duration of the animation in seconds
+easing    easeOut   The easing method
+callback  none      A function to execute when the anim completes
+scope     this      The scope (this) of the callback function
+
+
// Element animation options object
+var opt = {
+    duration: 1,
+    easing: 'elasticIn',
+    callback: this.foo,
+    scope: this
+};
+// animation with some options set
+el.setWidth(100, opt);
+

The Element animation object being used for the animation will be set on the options +object as "anim", which allows you to stop or manipulate the animation. Here is an example:

+
// using the "anim" property to get the Anim object
+if(opt.anim.isAnimated()){
+    opt.anim.stop();
+}
+

Also see the animate method for another animation technique.

+

Composite (Collections of) Elements

For working with collections of Elements, see Ext.CompositeElement

Public Properties

PropertyDefined By
 DISPLAY : Number
Visibility mode constant for use with setVisibilityMode. Use display to hide element
Element
 VISIBILITY : Number
Visibility mode constant for use with setVisibilityMode. Use visibility to hide element
Element
 autoBoxAdjust : Object
true to automatically adjust width and height settings for box-model issues (default to true)
Element
 defaultUnit : String
The default unit to append to CSS values where a unit isn't provided (defaults to px).
Element
 dom : HTMLElement
The DOM element
Element
 id : String
The DOM element ID
Element
 originalDisplay : String
The element's default display mode (defaults to "")
Element

Public Methods

MethodDefined By