jQuery 获取屏幕高度、宽度
做手机Web开发做浏览器兼容用到了,所以在网上找了些汇总下。
alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height());//浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width());//浏览器当前窗口文档对象宽度
alert($(document.body).width());//浏览器当前窗口文档body的高度
alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin
// 获取页面的高度、宽度
var xScroll, yScroll;
if (window.innerHeight && window.scrollMaxY) {
xScroll = window.innerWidth + window.scrollMaxX;
yScroll = window.innerHeight + window.scrollMaxY;
} else {
if (document.body.scrollHeight > document.body.offsetHeight) { // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else { // Explorer Mac…would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}
}
var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
if (document.documentElement.clientWidth) {
windowWidth = document.documentElement.clientWidth;
} else {
windowWidth = self.innerWidth;
}
windowHeight = self.innerHeight;
} else {
if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
windowWidth = document.documentElement.clientWidth;
windowHeight = document.documentElement.clientHeight;
} else {
if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
}
}
}
// for small pages with total height less then height of the viewport
if (yScroll < windowHeight) {
pageHeight = windowHeight;
} else {
pageHeight = yScroll;
}
// for small pages with total width less then width of the viewport
if (xScroll < windowWidth) {
pageWidth = xScroll;
} else {
pageWidth = windowWidth;
}
arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight);
return arrayPageSize;
}
// 滚动条
document.body.scrollTop;
$(document).scrollTop()
jQuery 获取屏幕高度、宽度的更多相关文章
- js和jQuery 获取屏幕高度、宽度
js获取屏幕高度,宽带 网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body ...
- 转载:jQuery 获取屏幕高度、宽度
做手机Web开发做浏览器兼容用到了,所以在网上找了些汇总下. alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height() ...
- js获取屏幕高度宽度
获取各种屏幕的宽度和高度Javascript: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网页可见区域宽 ...
- jquery的height()和javascript的height总结,js获取屏幕高度
jquery的height()和javascript的height总结,js获取屏幕高度 2014年9月18日 15048次浏览 引子 今天是九一八事变八十三周年,大家勿忘国耻!加油学习!经济和技术等 ...
- Android 获取屏幕高度,宽度,状态栏高度
背景介绍: 到目前为止,android已经从1.5发展到目前的3.2,我们在写一个应用的时候,最常用到得就是获取屏幕高度,宽度,以及status bar的高度. 然而android系统变化太快了,从开 ...
- JS获取屏幕高度
主要使用了document对象关于窗口的一些属性,这些属性的主要功能和用法如下. 要 得到窗口的尺寸,对于不同的浏览器,需要使用不同的属性和方法:若要检测窗口的真实尺寸,在netscape下需要使用w ...
- Android获取屏幕高度、标题高度、状态栏高度详解
Android获取屏幕高度的方法主要由view提供 通过View提供的方法获取高度方式有两种: 1, 当前显示的view中直接获取当前view高宽2,通过Activity的getWindow().fi ...
- Jquery获对HTML控件的控制
Jquery获对HTML控件的控制 1.获取控件的值 1.1.radio 1.1.1 获取一组radio被选中项的值 var item = $('input[name=items][checked] ...
- jQuery计算文本宽度和input标签根据输入字符动态自适应宽度的实现
jQuery计算文本宽度的原理是利用html提供的<pre>标签,向dom中动态添加<pre>标签,标签里的内容就是要测试长度的文本,获取完长度之后再删除刚才添加的<pr ...
随机推荐
- py
import httplib,urllib import re import random def Login(userid,password): params=urllib.urlencode({' ...
- mac pods 安装
CocoaPods的安装步骤: 1.先配置Ruby环境: 若已安装Ruby,请升级Ruby环境 sudo gem update --system 若没有安装,则请看下面, 以下代码区域,带有 $ 打头 ...
- 适配各种Windows分辨率,为DPI添加感知,当在高DPI时,禁用WINFORM缩放等。
因为现在高分屏越来越多,很多windows设备必须设置高DPI,这样很容易导致WINFORM整体错位,因此我们需要自己适配.禁止缩放 在程序配置清单 mainfest中添加如下. <assemb ...
- eclipse自动排版JSP问题
eclipse自动排版JSP非常难看,标签每行显示不完整,开发时很难受,下面设置一下这个就好多了: window-->preferences-->Web-->HTML Files-- ...
- 考前预习(Ubuntu配备)
这几天考前预习,趁现在不想预习,写点之前就想写的东西吧. 贴一下个人认为有用的,在Ubuntu装机后的一些小事.不过挺杂的,主要是拿来给以后的自己看,以及让现在无聊的我有点事做. 首先,Ubuntu官 ...
- java实现记住密码功能(利用cookie)
<br> <input type="text" id="userName" name="userName" value=& ...
- "传成老树白茶"献礼母亲节 邀市民品茗感受茶文化
5月8日下午,传成老树白茶巡回中国公益品鉴会第七十站,走进福州马尾区东方名城传成老树白茶文化馆. 本次品鉴会活动以“感恩母亲节”为主题,以马尾船政文化为背景,邀福州市民一起品鉴白茶,感受中国茶文化. ...
- Android-LinearLayout(线性布局)
布局:Android为我们提供了一个View和ViewGroup子类的集合.ViewGroup类是View的子类,也被称为Layout布局,它提供了流式布局.线性布局等多种布局方式.View是绘制在屏 ...
- js简单 图片版时钟,带翻转效果
js简单 图片版时钟,带翻转效果 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- centos7.0 下安装jdk1.8
centos7.0这里安装jdk1.8采用yum安装方式,非常简单. 1.查看yum库中jdk的版本 [root@localhost ~]# yum search java|grep jdk 2.选择 ...