js获取整个屏幕的尺寸
首先获取屏幕宽度:window.screen.width; //整个屏幕的宽度。

然后获取屏幕高度:window.screen.height; //整个屏幕的高度。

获取可用工作区尺寸。
获取屏幕可用工作区域宽度:window.screen.availWidth; //pc端与上面两个一致,移动端除个别其他也一致(试一下即可)
获取屏幕可用工作区域高度:window.screen.availHeight;

获取body的宽高(不含边框)。
获取网页内body的宽度:document.body.clientWidth; //client不包括边框
获取网页内body的高度:document.body.clientHeight;

获取网页的宽高。
获取整个网页的宽度:document.body.scrollWidth
获取整个网页的高度:document.body.scrollHeight

获取body的宽高(含边框)。
获取网页内body的宽度:document.body.offsetWidth //offset包括边框
获取网页内body的高度:document.body.offsetHeight

- 7
获取元素到顶部的距离。
获取元素到顶部的距离:document.getElementsByClassName("div")[0].offsetTop
获取元素到左边的距离:document.getElementsByClassName("div")[0].offsetLeft
js获取整个屏幕的尺寸的更多相关文章
- js获取浏览器屏幕的尺寸
浏览器屏幕尺寸参照表: 如何获取屏幕宽度: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽: ...
- JS获取终端屏幕、浏览窗口的相关信息
查看终端屏幕相关信息,在windows系统的控制面板可以查到分辨率且可以设置,更具体的浏览器可视窗口等信息则需要借助其他工具.而在程序里需要动态获取时该怎么做呢? 琢磨的一个js方法,供大家参考.如下 ...
- js 获取 网页屏幕高度 窗口高度 元素高度 滚动高度
常用: JS 获取浏览器窗口大小 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 // 获取窗口宽度 if (window.innerWidth) winWidth = ...
- js获取图片的原始尺寸
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...
- js获取网页屏幕可视区域高度
document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.document ...
- JS获取浏览器可视区域尺寸
本文所说的是浏览器窗口的可视区域大小,不是浏览器窗口大小,也非页面尺寸. 在没有声明DOCTYPE的IE中,浏览器显示窗口大小只能以下获取: document.body.offsetWidth doc ...
- js获取网页屏幕可见区域高度
document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...
- [js]获取网页屏幕可见区域高度
document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.docume ...
- js获取手机屏幕宽度、高度
网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...
随机推荐
- 原生 JS 绑定事件 移除事件
监听事件的绑定与移除主要是addEventListener和removeEventListener的运用. addEventListener语法 element.addEventListener(ty ...
- SpringCloud多网卡配置(转)
https://blog.csdn.net/lixiang987654321/article/details/88134324 docker部署过程中遇到如下问题: (1)docker容器创建之后,进 ...
- HTML 5浏览器端数据库
HTML 5浏览器端数据库为什么要使用浏览器端数据库:随着浏览器处理能力的增强,越来越多的双喜鸟网站开始考虑在客户端存储大量的数据,这可以减少用户从服务器获取数据的等待时间. 1.本地存储-本地存储可 ...
- HTML的标签简单概括
段落标签 <p></p> 属性 说明 值 align 对其方式 left(默认).right.center 水平线 <hr /> 属性 说明 值 width ...
- list列表的使用
Python最常用的数据类型之一,通过列表可以对数据实现最方便的存储.修改等操作 list1 = [1,2,3,4,5,6,7,8,9] #创建列表 z = list([1,2,3,4,5,6,7,8 ...
- 《设计模式之美》 <02>评判代码质量好坏的维度
如何评价代码质量的高低? 实际上,咱们平时嘴中常说的“好”和“烂”,是对代码质量的一种描述.“好”笼统地表示代码质量高,“烂”笼统地表示代码质量低.对于代码质量的描述,除了“好”“烂”这样比较简单粗暴 ...
- web开发:javascript动画
一.鼠标事件 二.js盒模型 三.鼠标拖拽 四.键盘事件 五.其他时间应用 六.定时器 七.定时器案例 八.随机数 一.鼠标事件 <!DOCTYPE html> <html> ...
- 微信小程序开发(六)获取手机信息
// succ.js var app = getApp() Page({ data: { mobileModel: '', // 手机型号 mobileePixelRatio: '', // 手机像素 ...
- 作业八——非确定的自动机NFA确定化为DFA
NFA 确定化为 DFA 子集法: f(q,a)={q1,q2,…,qn},状态集的子集 将{q1,q2,…,qn}看做一个状态A,去记录NFA读入输入符号之后可能达到的所有状态的集合. 步骤: 1. ...
- 解决Python中出现的问题: “You are using pip version 9.0.1, however version 19.2.3 is available. You should consider upgrading via the 'python -m pip install --upgrade pip' command.”
1. 一开始我在使用Pycharm时,导入numpy库,发现导入错误: Non-zero exit code (1) 2. 于是我通过更新的方法来解决,哪知道在更新的时候也出现了错误,错误如下图: 这 ...