当前位置:网站首页>JS to get the browser and screen height
JS to get the browser and screen height
2022-04-23 21:23:00 【Sister Chunfeng】
Javascript:
IE in :
document.body.clientWidth ==> BODY Object width
document.body.clientHeight ==> BODY Object height
document.documentElement.clientWidth ==> The width of the visible area
document.documentElement.clientHeight ==> Height of visible area
FireFox in :
document.body.clientWidth ==> BODY Object width
document.body.clientHeight ==> BODY Object height
document.documentElement.clientWidth ==> The width of the visible area
document.documentElement.clientHeight ==> Height of visible area
Opera in :
document.body.clientWidth ==> The width of the visible area
document.body.clientHeight ==> Height of visible area
document.documentElement.clientWidth ==> Page object width ( namely BODY Object width plus Margin wide )
document.documentElement.clientHeight ==> Page object height ( namely BODY Object height plus Margin high )
alert(document.body.clientWidth); // Page visible area width (body)
alert(document.body.clientHeight); // Page visible area high (body)
alert(document.body.offsetWidth); // Page visible area width (body), Include border、margin etc.
alert(document.body.offsetHeight); // Page visible area width (body), Include border、margin etc.
alert(document.body.scrollWidth); // Full text width of web page body , Include the unseen area with scroll bar
alert(document.body.scrollHeight); // Page body full text height , Include the unseen area with scroll bar
alert(document.body.scrollTop); // Web pages are rolled away Top( Scroll bar )
alert(document.body.scrollLeft); // Web pages are rolled away Left( Scroll bar )
alert(window.screenTop); // Browser distance Top
alert(window.screenLeft); // Browser distance Left
alert(window.screen.height); // High screen resolution
alert(window.screen.width); // Width of screen resolution
alert(window.screen.availHeight); // The height of the screen's usable workspace
alert(window.screen.availWidth); // The width of the screen's usable workspace
Jquery
alert($(window).height()); // The height of the viewable area of the browser's current window
alert($(document).height()); // The height of the browser's current window document
alert($(document.body).height()); // Browser current window document body Height
alert($(document.body).outerHeight(true)); // Browser current window document body The total height of Include border padding margin
alert($(window).width()); // The width of the viewable area of the browser's current window
alert($(document).width()); // Browser current window document object width
alert($(document.body).width()); // Browser current window document body Width
alert($(document.body).outerWidth(true)); // Browser current window document body Total width of Include border padding margin
版权声明
本文为[Sister Chunfeng]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/110/202204200620164144.html
边栏推荐
- Singleton mode
- Flomo software recommendation
- Is qiniu school useful and is the recommended securities account safe
- Tensorflow realizes gradient accumulation, and then returns
- setInterval、setTimeout、requestAnimationFrame
- 【SDU Chart Team - Core】SVG属性类设计之枚举
- 1. Finishing huazi Mianjing -- 1
- Deep analysis of C language function
- 亚马逊和Epic将入驻,微软应用商城向第三方开放
- What if Jenkins forgot his password
猜你喜欢
Deno 1.13.2 发布
1.整理华子面经--1
Flomo software recommendation
2.整理华子面经--2
[※ leetcode refers to offer 32 - II. Print binary tree II from top to bottom (simple)]
Minecraft 1.12.2模组开发(四十三) 自定义盾牌(Shield)
Deep analysis of C language pointer (Part I)
[leetcode refers to the two numbers of offer 57. And S (simple)]
Gsi-ecm digital platform for engineering construction management
Mysql database common sense storage engine
随机推荐
Common problems in deploying projects with laravel and composer for PHP
又一款数据分析神器:Polars 真的很强大
matplotlib. Pyplot partition drawing
Thinkphp5 + data large screen display effect
2. Finishing huazi Mianjing -- 2
Thinking after learning to type
[leetcode refers to offer 25. Merge two sorted linked lists (simple)]
Keywords static, extern + global and local variables
IOT design and development
Minecraft 1.12.2 module development (43) custom shield
thinkphp5+数据大屏展示效果
Realrange, reduce, repeat and einops in einops package layers. Rearrange and reduce in torch. Processing methods of high-dimensional data
C knowledge
2.整理华子面经--2
[leetcode refers to the substructure of offer 26. Tree (medium)]
Prim、Kruskal
Pipes and xargs
ROS learning notes - tutorial on the use of ROS
100天拿下11K,转岗测试的超全学习指南