The offsetHeight , offsetWidth , offsetLeft , offsetRight , and offsetParent Properties


The offsetHeight , offsetWidth , offsetLeft , offsetRight , and offsetParent Properties

The 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

Property

NS2

NS3

NS4

NS6

IE3a

IE3b

IE4

IE5

IE5.5

IE6

offsetHeight

     

x

   

x

x

x

x

 

Read-only

 

Type: Integer

offsetWidth

     

x

   

x

x

x

x

 

Read-only

 

Type: Integer

offsetLeft

     

x

   

x

x

x

x

 

Read-only

 

Type: Integer

offsetTop

     

x

   

x

x

x

x

 

Read-only

 

Type: Integer

offsetParent

     

x

   

x

x

x

x

 

Read-only

 

Type: Object

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. graphics/ccc.gif offsetParent.tagName)  // -->          </SCRIPT>      </BODY>  </HTML> 

You can see the results in Figure 5.14.

Figure 5.14. Using the offset properties.

graphics/05fig14.gif



Inside Javascript
Inside JavaScript
ISBN: 0735712859
EAN: 2147483647
Year: 2005
Pages: 492
Authors: Steve Holzner

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net