JS is perfectly compatible with the scrolltop methods of various browsers, and jsscrolltop

Source: Internet
Author: User

JS is perfectly compatible with the scrolltop methods of various browsers, and jsscrolltop

1. Differences of scrollTop in different browsers

IE6/0/6/7/8/9/10:

For pages without doctype declaration, you can use document. body. scrollTop to obtain the scrollTop height;
For pages with doctype declaration, you can use document.doc umentElement. scrollTop;

Safari:

Safari is quite special. You have a function to get scrollTop: window. pageYOffset;

Firefox:

Firefox and other relatively standard browsers are much more worry-free. You can directly use document.doc umentElement. scrollTop;

2. Obtain the scrollTop Value

ScrollTop assignment phrase:

Copy codeThe Code is as follows:
Var scrollTop = document.doc umentElement. scrollTop | window. pageYOffset | document. body. scrollTop;

The scrollTop value can be obtained under any circumstances through this assignment.

After carefully observing the assignment, what did you find ??
That is, the window. pageYOffset (Safari) is placed in the center of |.

This is because the system returns the last value by default when the numbers 0 and undefine are used for or operations. 0 = undefine;

When the page scroll bar is at the top, that is, the scrollTop value is 0, the window under IE. pageYOffset (Safari) returns undefine. when pageYOffset (Safari) is placed at the end of the or operation, scrollTop returns undefine. When undefine is used for subsequent operations, an error is reported.

Other Browsers Do not return undefine regardless of the value assignment or operation sequence of scrollTop. It can be used safely ..

So it's still a problem with IE. Cup...

I am a little confused and do not know whether to express myself clearly.
However, the experiment is too good, so you can use it with confidence.

Copy codeThe Code is as follows:
Var scrollTop = document.doc umentElement. scrollTop | window. pageYOffset | document. body. scrollTop;

This is a perfect assignment statement to obtain scrollTop.

The above is all the content of this article. I hope you will like it.

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.