Get browser window height width js/jquery code

Source: Internet
Author: User
Tags jquery library

One is implemented using jquery, which is done by downloading the jquery library.

The code is as follows Copy Code
<script type= "Text/javascript" >
$ (document). Ready (
function ()
{
var h = $ (window). Height ();
Alert (h);
}
)
</script>

In IE 805
Under the FF whether 787 Oh,

The two browsers are different because they display pixels because of the difference between browsing and padding and margin.


JS get browser height and width values

Page visible area wide: document.body.clientWidth
Page visible Area High: document.body.clientHeight
Web page Visible area wide: document.body.offsetWidth (including edge width)
Page visible Area High: document.body.offsetHeight (including edge height)
Page body Full text width: document.body.scrollWidth
The full text of the Web page High: document.body.scrollHeight
Web pages are rolled up high: Document.body.scrollTop
Pages were rolled away to the left: Document.body.scrollLeft
Web page body part: Window.screentop
Page body part left: Window.screenleft
High screen resolution: Window.screen.height
Width of screen resolution: Window.screen.width
Screen available Workspace height: window.screen.availHeight
Screen available workspace width: window.screen.availWidth

Knowing the above parameters, we can easily implement the browser height and width of the code

In IE without declaring doctype, the browser display window size can only be obtained as follows:

The code is as follows Copy Code

Document.body.offsetWidth
Document.body.offsetHeight

In a browser that declares DOCTYPE, you can use the following to get the browser display window size:

The code is as follows Copy Code

Document.documentElement.clientWidth
Document.documentElement.clientHeight

Ie,ff,safari supports this method, although opera supports this property, but returns the page size;

At the same time, all browsers except IE have this information saved in the Window object, which can be obtained using the following:

  code is as follows copy code

Window.innerwid Th
window.innerheight

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.