Custom Type to allow all of its methods to be used with any DOM element via the dollar function $.

• These methods don't take into consideration the body element margins and borders. If you need margin/borders on the body, consider adding a wrapper div, but always reset the margin and borders of body to 0.
• If you need to measure the properties of elements that are not displayed (either their display style is none or one of their parents display style is none), you will need to use Element.measure to expose it.

• Element positioning based on the qooxdoo code and smart browser fixes, LGPL License.
• Viewport dimensions based on YUI code, BSD License.

Scrolls the element to the specified coordinated (if the element has an overflow). The following method is also available on the Window object.

myElement.scrollTo(x, y);

1. x - (number) The x coordinate.
2. y - (number) The y coordinate.

$('myElement').scrollTo(0, 100);

• MDN Element:scrollLeft, MDN Element:scrollTop

Returns the height and width of the Element, taking into account borders and padding. The following method is also available on the Window object.

myElement.getSize();

• (object) An object containing the width (as x) and the height (as y) of the target Element.

var size = myElement.getSize();
alert('The element is ' + size.x + ' pixels wide and ' + size.y + 'pixels high.');

If you need to measure the properties of elements that are not displayed (either their display style is none or one of their parents display style is none), you will need to use Element.measure to expose it.

Returns an Object representing the size of the target Element, including scrollable area. The following method is also available on the Window object.

myElement.getScrollSize();

• (object) An object containing the x and y dimensions of the target Element.

var scroll = $('myElement').getScrollSize();
alert('My element can scroll to ' + scroll.y + 'px'); // alerts 'My element can scroll down to 820px'

• MDN Element:scrollLeft, MDN Element:scrollTop, MDN Element:offsetWidth, MDN Element:offsetHeight, MDN Element:scrollWidth, MDN Element:scrollHeight

If you need to measure the properties of elements that are not displayed (either their display style is none or one of their parents display style is none), you will need to use Element.measure to expose it.

Returns an Object representing how far the target Element is scrolled in either direction. The following method is also available on the Window object.

myElement.getScroll();

• (object) An object containing the x and y dimensions of the target Element's scroll.

var scroll = $('myElement').getScroll();
alert('My element is scrolled down ' + scroll.y + 'px'); // alerts 'My element is scrolled down to 620px'

If you need to measure the properties of elements that are not displayed (either their display style is none or one of their parents display style is none), you will need to use Element.measure to expose it.

Returns the real offsets of the element.

myElement.getPosition(relative);

relative - (Element, defaults to the document) If set, the position will be relative to this Element.

• (object) An object with the x and y coordinates of the Element's position.

$('element').getPosition(); // returns {x: 100, y: 500};

• QuirksMode: Find position

If you need to measure the properties of elements that are not displayed (either their display style is none or one of their parents display style is none), you will need to use Element.measure to expose it.

Sets the position of the element's left and top values to the x/y positions you specify.

myElement.setPosition(positions);

1. positions - (object) an object with x/y values (integers or strings, i.e. 10 or "10px")

• (element) the element that is positioned.

myElement.setPosition({x: 10, y: 100});

Returns an object with width, height, left, right, top, and bottom coordinate values of the Element.

myElement.getCoordinates(relative);

relative - (element, optional) if set, the position will be relative to this element, otherwise relative to the document.

• (object) An object containing the Element's current: top, left, width, height, right, and bottom.

var myValues = $('myElement').getCoordinates();

{
    top: 50,
    left: 100,
    width: 200,
    height: 300,
    right: 300,
    bottom: 350
}

Element:getPosition

If you need to measure the properties of elements that are not displayed (either their display style is none or one of their parents display style is none), you will need to use Element.measure to expose it.

Returns the parent of the element that is positioned, if there is one.

myElement.getOffsetParent();

• (mixed) If the element has a parent that is positioned, it returns that element, otherwise it returns null.