Home > Web Front-end > JS Tutorial > jQuery javascript implementation code to obtain the height and width of a web page_javascript skills

jQuery javascript implementation code to obtain the height and width of a web page_javascript skills

WBOY
Release: 2016-05-16 15:03:48
Original
1244 people have browsed it

Visible area width of web page: document.body.clientWidth
The height of the visible area of ​​the web page: document.body.clientHeight
The width of the visible area of ​​the web page: document.body.offsetWidth (including the width of the edge)
The height of the visible area of ​​the web page: document.body.offsetHeight (including the height of the edge)
Full text width of web page body: document.body.scrollWidth
Full text height of web page body: document.body.scrollHeight
The page is scrolled high: document.body.scrollTop
The left side of the web page being scrolled: document.body.scrollLeft
On the main body of the web page: window.screenTop
The left side of the main body of the web page: window.screenLeft
The height of the screen resolution: window.screen.height
The width of the screen resolution: window.screen.width
Screen available workspace height: window.screen.availHeight

Screen available workspace width: window.screen.availWidth

jquery

Get the height of the browser display area: $(window).height();
Get the width of the browser display area: $(window).width();
Get the document height of the page: $(document).height();
Get the document width of the page:
$(document).width();

Get the vertical height of the scroll bar to the top: $(document).scrollTop();
Get the vertical width of the scroll bar to the left: $(document).scrollLeft();

Calculate element position and offset


The offset method is a very useful method, which returns the offset information of the first element in the packed set. By default, it is the offset information relative to the body. The result contains two attributes, top and left.
offset(options, results)
options.relativeTo specifies the ancestor element relative to the calculated offset position. This element should be positioned relative or absolutely. If omitted, it is relative to body.
options.scroll Whether to include scroll bars, default TRUE
options.padding Whether to include padding, default false
options.margin Whether to include margin in the calculation, default true
options.border Whether to include the border, default true

The above jQuery javascript to obtain the height and width of a web page is all the content shared by the editor. I hope it can give you a reference, and I also hope that everyone will support Script Home.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template