原生js获取pc和移动端屏幕宽、高的方法
pc端:
var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
移动端:
网页可见区域宽:document.body.clientWidth
网页可见区域高:document.body.clientHeight
网页可见区域宽:document.body.offsetWidth (包括边线的宽)
网页可见区域高:document.body.offsetHeight (包括边线的宽)
网页正文全文宽:document.body.scrollWidth
网页正文全文高:document.body.scrollHeight
网页被卷去的高:document.body.scrollTop
网页被卷去的左:document.body.scrollLeft
网页正文部分上:window.screenTop
网页正文部分左:window.screenLeft
屏幕分辨率的高:window.screen.height
屏幕分辨率的宽:window.screen.width
屏幕可用工作区高度:window.screen.availHeight
屏幕可用工作区宽度:window.screen.availWidth 例:
<script type="text/javascript">
var w = window.innerWidth
|| document.documentElement.clientWidth //获取pc的宽,一般在pc上调试的时候用
|| document.body.clientWidth;
var h = window.innerHeight
|| document.documentElement.clientHeight //获取pc的高
|| document.body.clientHeight;
var w1 = window.screen.width //获取手机屏幕的宽 ,在实际上线的时候使用
window.onload = function(){
if(w < 415){
window.location.assign('tf/index.html');
}else{
window.location.assign('sh/index.html');
}
if(w1 < 415){
window.location.assign('tf/index.html');
}else{
window.location.assign('sh/index.html');
}
}
</script>
原生js获取pc和移动端屏幕宽、高的方法的更多相关文章
- 原生JS 获取浏览器、窗口、元素等尺寸的方法及注意事项
一.通过浏览器获得屏幕的尺寸 screen.width screen.height screen.availHeight //获取去除状态栏后的屏幕高度 screen.availWidth //获取去 ...
- js获取图片信息(二)-----js获取img的height、width宽高值为0
首先,创建一个图片对象: var oImg= new Image(); oImg.src = "apple.jpg"; 然后我们打印一下图片的信息: console.log(oIm ...
- android获取屏幕宽高与获取控件宽高
获取屏幕宽高 // 获取屏幕宽高(方法1) int screenWidth = getWindowManager().getDefaultDisplay().getWidth(); // 屏幕宽(像素 ...
- 原生js获取鼠标坐标方法全面讲解-zmq
原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...
- 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题
1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...
- 兼容各版本浏览器,封装原生Js获取ClassName
web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...
- (转)JS获取当前对象大小以及屏幕分辨率等
原文 JS获取当前对象大小以及屏幕分辨率等 <script type="text/javascript">function getInfo(){ var ...
- JS获取当前对象大小以及屏幕分辨率等...
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta nam ...
- 【Javascript Demo】JS获取当前对象大小以及屏幕分辨率等
效果如下: 代码如下: <html> <head> <title>获取当前对象大小以及屏幕分辨率等</title> <body> <d ...
随机推荐
- jquery touch 移动端上下滑动加载
var touchStart, touchEnd, touchDiff = 80; $(window).on({ 'touchstart': function (e) { touchStart = e ...
- JMeter Concurrency Thread Group阶梯式加压
初始使用,做了下总结 1.首先下载Concurrency Thread Group并发线程组插件,选择或者搜索Custom Thread Groups: 下载完成之后,JMeter会自动重启. 2.在 ...
- Oracle-11:联合查询
------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 联合查询的实际上的意义就是从俩个结果集中拿有特定联系的结果封装为一个结果集 数据库脚本给放一份,供测试使用 c ...
- SSM-Spring-22:Spring+Mybatis+JavaWeb的整合
------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 众所周知,框架Spring来整合别的框架,但是Mybatis出现的晚,Spring就没有给他提供支持,那怎么办 ...
- 错误 C2280 Union : 尝试引用已删除的函数 以及 警告 C4624 “Grade”: 已将析构函数隐式定义为“已删除”的一种解决方法
Union 是C/C++语言中的一种结构类型,用于定义可共享内存的数据变量的一种方式,初次使用Union联合体时可能会遇到以下问题: 错误 C2280 Union : 尝试引用已删除的函数 警告 C4 ...
- MonolithFirst
As I hear stories about teams using a microservices architecture, I've noticed a common pattern. Alm ...
- 基于微服务API级权限的技术架构
一般而言,企业内部一套成熟的权限系统,都是基于角色(Role)的 访问控制方法(RBAC – Role Based Access Control),即权限 (Permission)与角色相关联,用户( ...
- thinter中button按钮控件(三)
button控件 简单的实现: import tkinter wuya = tkinter.Tk() wuya.title("wuya") wuya.geometry(" ...
- 运维监控利器Nagios之:nagios配置详解
http://ixdba.blog.51cto.com/2895551/752870 一.nagios配置过程详解 1.nagios默认配置文件介绍 nagios安装完毕后,默认的配置文件在/usr ...
- Python 的 urllib.parse 库解析 URL
Python 中的 urllib.parse 模块提供了很多解析和组建 URL 的函数. 解析url urlparse() 函数可以将 URL 解析成 ParseResult 对象.对象中包含了六 ...