1 Type: Element {#Element}
2 ========================
4 Custom Type to allow all of its methods to be used with any DOM element via the dollar function [$][].
8 Element Method: setStyle {#Element:setStyle}
9 --------------------------------------------
11 Sets a CSS property to the Element.
15 myElement.setStyle(property, value);
19 1. property - (*string*) The property to set.
20 2. value - (*mixed*) The value to which to set it. Numeric values of properties requiring a unit will automatically be appended with 'px'.
24 * (*element*) This element.
27 //Both lines have the same effect.
28 $('myElement').setStyle('width', '300px'); // the width is now 300px.
29 $('myElement').setStyle('width', 300); // the width is now 300px.
33 - All number values will automatically be rounded to the nearest whole number.
37 Element Method: getStyle {#Element:getStyle}
38 --------------------------------------------
40 Returns the style of the Element given the property passed in.
44 var style = myElement.getStyle(property);
48 1. property - (*string*) The css style property you want to retrieve.
52 * (*string*) The style value.
56 $('myElement').getStyle('width'); // returns "300px".
57 $('myElement').getStyle('width').toInt(); // returns 300.
61 Element Method: setStyles {#Element:setStyles}
62 ----------------------------------------------
64 Applies a collection of styles to the Element.
68 myElement.setStyles(styles);
72 1. styles - (*object*) An object of property/value pairs for all the styles to apply.
76 * (*element*) This element.
80 $('myElement').setStyles({
81 border: '1px solid #000',
88 - [Element:getStyle][]
92 Element Method: getStyles {#Element:getStyles}
93 ----------------------------------------------
95 Returns an object of styles of the Element for each argument passed in.
99 var styles = myElement.getStyles(property[, property2[, property3[, ...]]]);
103 1. properties - (*strings*) Any number of style properties.
107 * (*object*) An key/value object with the CSS styles as computed by the browser.
111 $('myElement').getStyles('width', 'height', 'padding');
112 // returns {width: '10px', height: '10px', padding: '10px 0px 10px 0px'}
116 - [Element:getStyle][]
120 [$]: /core/Element/Element/#Window:dollar
121 [Element:getStyle]: #Element:getStyle