JavaScript top clienttop scrolltop offsettop (1/5)

Offsetleft

Suppose that obj is an HTML control.

Obj.offsettop refers to the position, integer, and pixel of the obj from the top or upper control.

Obj.offsetleft refers to the position, integer, and pixel of obj from the left or upper control.

Obj.offsetwidth refers to the width, integer, and unit pixel of the obj control itself.

Obj.offsetheight refers to the height, integer, and unit pixel of the obj control itself.

We describe the above or upper and left or upper controls as mentioned above.

For example:
<div id= "Tool" >
<input type= "button" value= "Submit" >
<input type= "button" value= "Reset" >
</div>

The offsettop of the submit button refers to the distance from the top border of the tool layer, because the top edge of the "tool" layer is the closest to the top of the "the".
offsettop of the reset button refers to the distance from the "reset" button to the top border of the tool layer, because the top edge of the "tool" layer is closest to the top.

The offsetleft of the submit button refers to the distance from the left border of the tool layer, because the closest to the left of the "tool" layer is the left border.
Offsetleft of the reset button refers to the distance from the right border of the submit button, because the right border of the submit button is closest to the left of the "reset" button.

The above properties are also valid in Firefox.

Also: What we're talking about here is the attribute value of the HTML control, not the Document.body,document.body value in different browsers (in fact, most environments are caused by different interpretations of the document.body, not because of the Offset to explain the difference caused), click here to view the different points.
Title: The difference between offsettop and style.top

Preparatory knowledge: offsettop, Offsetleft, offsetwidth, offsetheight

We know that offsettop can get the position of the HTML element distance above or the outer element, Style.top is also OK, the difference is:

One, offsettop return is a number, and Style.top returns a string, in addition to the number of units: px.

Second, offsettop read only, and Style.top can read and write.

Third, if the HTML element has not been specified with the top style, then Style.top returns an empty string.

The same is true of Offsetleft and Style.left, offsetwidth and Style.width, Offsetheight and Style.height.
Title: ClientHeight, Offsetheight and ScrollHeight

Here we talk about the explanations of the clientheight, offsetheight, and scrollheight of the four browsers for Document.body, which is document.body, and if it is HTML, then there is a difference, click here to see.

These four types of browsers are IE (Internet Explorer), NS (Netscape), opera, FF (Firefox).

home 1 2 3 4 5 last