The offsetHeight , offsetWidth , offsetLeft , offsetRight , and offsetParent PropertiesThe offsetHeight , offsetWidth , offsetLeft , and offsetRight properties give the offset, in pixels, of an object from its parent container (for both the object and the parent object, the origin, (0, 0), is at upper left). The offsetParent property holds the parent object that these properties are measured with respect to. You can see the support for this property in Table 5.40. Table 5.40. The offsetHeight , offsetWidth , offsetLeft , offsetRight , and offsetParent Properties
Here's an example putting these properties to work; in this example, I'm reporting the offset of an <H1> header from its parent, and reporting the parent's tag name (which is "BODY" ): (Listing 05-18.html on the web site)<HTML> <HEAD> <TITLE> Using the Offset Properties </TITLE> </HEAD> <BODY> <H1 ID="Header">Using the Offset Properties</H1> <SCRIPT LANGUAGE = "JavaScript"> <!-- alert("document.all.Header.offsetLeft = " + document.all.Header.offsetLeft) alert("document.all.Header.offsetTop = " + document.all.Header.offsetTop) alert("document.all.Header.offsetParent = " + document.all.Header. offsetParent.tagName) // --> </SCRIPT> </BODY> </HTML> You can see the results in Figure 5.14. Figure 5.14. Using the offset properties.
|