javascript获取屏幕高度和宽度、监听屏幕大小改变

1. 浏览器屏幕大小改变触发函数

window.οnresize=function(){  consolo.log($(window).width());consolo.log($(window).height());
}

2. 窗口大小

document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.clientHeight ==> 可见区域高度

3. 浏览器时下窗口

// 部分jQuery函数
$(window).height() 　//浏览器时下窗口可视区域高度
$(document).height()　　　　//浏览器时下窗口文档的高度
$(document.body).height()　　　　　　//浏览器时下窗口文档body的高度
$(document.body).outerHeight(true)　//浏览器时下窗口文档body的总高度 包括border padding margin
$(window).width() 　//浏览器时下窗口可视区域宽度
$(document).width()//浏览器时下窗口文档对于象宽度
$(document.body).width()　　　　　　//浏览器时下窗口文档body的高度
$(document.body).outerWidth(true)　//浏览器时下窗口文档body的总宽度 包括border padding

4. HTML精确定位

HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

javascript获取屏幕高度和宽度、监听屏幕大小改变相关推荐

JavaScript获取屏幕高度和宽度等信息
我们可以通过内置的document和window获取屏幕的一些属性,如高度.宽度等信息. 网页可见区域宽: document.body.clientWidth 网页可见区域高: document.bo ...
android屏幕密度高度,Android获取常用辅助方法(获取屏幕高度、宽度、密度、通知栏高度、截图)...
我们需要获取Android手机或Pad的屏幕的物理尺寸,以便于界面的设计或是其他功能的实现.下面就分享一下Android中常用的一些辅助方法: 获取屏幕高度: /** * 获得屏幕高度 * @para ...
js和jQuery 获取屏幕高度、宽度
js获取屏幕高度,宽带网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body ...
android 屏幕方向监听,Android如何监听屏幕旋转
背景关于个人,前段时间由于业务太忙,所以一直没有来得及思考并且沉淀点东西:同时组内一个个都在业务上能有自己的思考和总结,在这样的氛围下,不由自主的驱使周末开始写点东西,希望自己除了日常忙于业务,可以 ...
vue监听屏幕尺寸变化，window.onresize很简单
>> 可在任意组件中使用; 1.在data中定义一个变量,用于记录屏幕尺寸: data(){return{screenWidth: null, } } 且做好定义为 null 2.使用 ...
android 手机监听屏幕锁屏,用户解锁
用到的场景很多,自己发挥 ,废话不多说直接上代码: private classScreenBroadcastReceiverextendsBroadcastReceiver{privateString ...
监听屏幕 android.intent.action.USER_PRESENT
在做解锁监听程序时,一开始采用监听屏幕SCREEN_ON和SCREEN_OFF这两个action. 但奇怪的是,这两个action只能通过代码动态的形式注册,才能被监听到,使用AndroidManif ...
android 触摸监听重写_Android监听屏幕的滑动事件
实现监听屏幕上下左右滑动事件前段时间为了实现这个功能在网上找了很多教程,发现很多教程都是很大的篇幅,对于像我这种一点都不了解的人GestureListener的人来说可能很难理解,动不动就是几百行代 ...
android 监听屏幕是否锁屏
今天,简单讲讲如何监听手机屏幕是否锁屏. 实现方法:1)通过BroadcastReceiver接收广播Intent.ACTION_SCREEN_ON和Intent.ACTION_SCREEN_OFF可 ...
touch事件总结，监听屏幕点击事件
Touch对象--MDN TouchEvent--MDN 一.问题背景 click事件在移动端的300毫秒延迟问题当需要监听诸如左滑.右滑之类的事件二.知识点概括 1. 事件类型 touchsta ...

javascript获取屏幕高度和宽度、监听屏幕大小改变

1. 浏览器屏幕大小改变触发函数

2. 窗口大小

3. 浏览器时下窗口

4. HTML精确定位

javascript获取屏幕高度和宽度、监听屏幕大小改变相关推荐

最新文章

热门文章