X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..6b044c28b5f26fb99c86c237ffad19741c0f7f3d:/docs/output/Ext.Element.html diff --git a/docs/output/Ext.Element.html b/docs/output/Ext.Element.html index b59a9bc6..0278d37f 100644 --- a/docs/output/Ext.Element.html +++ b/docs/output/Ext.Element.html @@ -1,54 +1,55 @@ -
Properties Methods Events Direct Link

Class Ext.Element

Package:Ext
Defined In:Element.scroll.js, Element.position.js, Element.js, Element.insertion.js, Element.style.js, Element.traversal.js, Element.fx.js, Element.insertion-more.js, Element.legacy.js, Element.position-more.js, Element.keys.js, Element-more.js, Element.scroll-more.js, Element.fx-more.js, Element.style-more.js, Element.alignment.js, Element.dd.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