How to use javascript offset, client, and scroll

Source: Internet
Author: User
Javascript offset, client, and scroll are frequently used. Next we will introduce them one by one. For more information, see the absolute position script code.

function GetPosition(obj) { var left = 0; var top = 0; while(obj != document.body) { left = obj.offsetLeft; top = obj.offsetTop; obj = obj.offsetParent; } alert("Left Is : " + left + "\r\n" + "Top Is : " + top); }

6. scrollLeft:
The leftmost distance from the object to the left of the object in the range displayed in the current window.
That is, the distance pulled by the scroll bar when a horizontal scroll bar appears.

7. scrollTop
The distance from the top of the object to the top edge of the object in the range displayed in the current window.
That is, the distance pulled by the scroll bar when a vertical scroll bar appears.
Here we will talk about four types of browsers for document. the clientHeight, offsetHeight, and scrollHeight of the body. Here we are talking about document. body. If it is an HTML control, it is different. Click here to view details.
These four browsers are IE (Internet Explorer), NS (Netscape), Opera, and FF (FireFox ).

ClientHeight
Everyone has no objection to clientHeight and thinks it is the height of the visible area of the content, that is, the height of the area where the content can be viewed in the browser of the page, generally, the area below the last toolbar to above the status bar is irrelevant to the page content.

OffsetHeight
IE and Opera think offsetHeight = clientHeight + scroll bar + border.
NS and FF hold that offsetHeight is the actual height of the webpage content, which can be smaller than clientHeight.

ScrollHeight
IE and Opera hold that scrollHeight is the actual height of the webpage content, which can be smaller than clientHeight.
NS and FF think that scrollHeight is the height of the webpage content, but the minimum value is clientHeight.

Simply put
ClientHeight is the height of the area where the content is viewed through the browser.
NS and FF hold that both offsetHeight and scrollHeight are the content height of the webpage. However, when the content height of the webpage is less than or equal to clientHeight, the value of scrollHeight is clientHeight, while the value of offsetHeight can be less than clientHeight.
IE and Opera hold that offsetHeight is the clientHeight scroll bar and

For more details about how to use javascript offset, client, and scroll, please pay attention to PHP!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.