原生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 ...
随机推荐
- cocos2dx中的坐标系统
一. (1)OpenGL坐标系 Cocos2D-x以OpenGL和OpenGL ES为基础,所以自然支持OpenGL坐标系.该坐标系原点在屏幕左下角,x轴向右,y轴向上. (2)屏幕坐标系 屏幕坐标系 ...
- javascript 易漏点
javascript 是一种解释型语言,不是java或c++那样的编译语言.javascript指令以普通文本形式传递给浏览器,然后依次解释执行.它们不必首先“编译”成只有计算机处理器能理解的机器码. ...
- JavaScript (一、ECMAScript )
一.js简介和变量 1.JavaScript的概述组成和特点 a.JavaScript 是脚本语言,是世界上最流行的编程语言,这门语言可用于 HTML 和 web,更可广泛 用于服务器.PC.笔记本电 ...
- Java开源生鲜电商平台-支付模块的设计与架构(源码可下载)
Java开源生鲜电商平台-支付模块的设计与架构(源码可下载) 开源生鲜电商平台支付目前支持支付宝与微信.针对的是APP端(android or IOS) 1. 数据库表设计. 说明:无论是支付宝还 ...
- hessian在ssh项目中的配置
一. 在服务端发布一个web项目 1.创建一个动态的web项目,并导入hessian的jar包 2. 在服务端的crm项目中创建接口 package cn.rodge.crm.service;impo ...
- Extjs--12种布局方式
按照Extjs的4.1的文档来看,extjs的布局方式大致有12种,下面一一介绍,有些代码就是文档中的. 1.Border 边界布局 border布局,最多可以将页面分割为"东南西北中&qu ...
- java.lang.OutOfMemoryError: PermGen space 解决办法
最近在学习spring mvc时,用了大量的第三方jar包,导致启动tomcat时报内存溢出的错 java.lang.OutOfMemoryError: PermGen space 解决办法:在mye ...
- 如何把Python脚本导出为exe程序
一.pyinstaller简介 pyinstaller将Python脚本打包成可执行程序,使在没有Python环境的机器上运行 最新版是pyinstaller 3.1.1.支持python2.7和py ...
- centos7系统日志时间与系统时间相差8小时
场景:当我们修改完系统时间的时区后,我们去查看我们的系统日志的时间发现时区还是在之前的系统时间时区. [root@vp-n ~]# ls -l /etc/localtime lrwxrwxrwx 1 ...
- python 文件的写删改
# coding=utf-8 # !/usr/bin/python # -*- coding: UTF-8 -*- import io import os def file_chance(): #修改 ...