jQuery in Action
The Dimensions Plugin
285
9.2 The Dimensions Plugin
Knowing the exact position and dimensions of an element is sometimes key to
creating Rich Internet Applications. For example, when implementing dropdown
menus, we want the menu to appear in a precise position in relation to its trigger-
ing element.
creating Rich Internet Applications. For example, when implementing dropdown
menus, we want the menu to appear in a precise position in relation to its trigger-
ing element.
Core jQuery has the
width()
,
height()
, and
offset()
commands but lacks the
ability to precisely locate an element in all circumstances. That's where the
Dimensions Plugin comes in.
Dimensions Plugin comes in.
Let's take a run through its
API
.
9.2.1 Extended width and height methods
The Dimensions Plugin extends the core
width()
and
height()
commands so
that they can be used to obtain the width or height of the window and document
objects; something the core commands can't do. The syntaxes for these extended
commands are as follow:
objects; something the core commands can't do. The syntaxes for these extended
commands are as follow:
Command syntax: width
width()
Returns the width of the first element, window, or document object in the wrapped set.
If the first wrapped element isn't the window or the document, the core jQuery command
is called.
Parameters
none
Returns
The width of the window, document, or element.
The width of the window, document, or element.
Command syntax: height
height()
Returns the height of the first element, window, or document object in the wrapped set.
If the first wrapped element isn't the window or the document, the core jQuery command
is called.
Parameters
none
Returns
The height of the window, document, or element.
The height of the window, document, or element.