做手机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
// 获取页面的高度、宽度
function getPageSize() {
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();
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
// 获取页面的高度、宽度
function getPageSize() {
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-事件绑定与事件委托
2013-12-26 01:31 773jQuery中给DOM元素添加事件处理程序常用的方式: $(& ... -
深入分析Flex[Bindable]及使用方法
2012-01-20 01:21 424深入分析Flex[Bindable]及使用方法 2010年0 ... -
页面中嵌入FLEX应用-传参
2012-01-20 01:21 722页面中嵌入FLEX应用-传参 2010年06月29日 项 ... -
用Parsley实现Flex Ioc的简单例子
2012-01-20 01:21 661用Parsley实现Flex Ioc的简单例子 2010年0 ... -
Flex嵌入jsp开发心得
2012-01-20 01:21 504Flex嵌入jsp开发心得 2010年07月02日 PM ... -
flex与数据库交互
2012-01-20 01:21 358flex与数据库交互 2010年07月04日 Flex最 ... -
大全【极有收藏价值的】
2012-01-19 09:11 430大全【极有收藏价值的 ... -
提高小学作文实效性的思考
2012-01-19 09:11 351提高小学作文实效性的思考 2010年11月17日 摘要: ... -
小学生评语大全
2012-01-19 09:11 519小学生评语大全 2011年07月14日 你是一位可爱的小 ... -
小学生期末评语经典大全
2012-01-19 09:11 607小学生期末评语经典大全 2011年12月15日 1.你是 ... -
超级爆笑小学生作文大全,这孩子太搞了
2012-01-19 09:11 583超级爆笑小学生作文大全,这孩子太搞了 2011年11月03日 ... -
操作系统总结(除课后计算题外)
2012-01-17 01:40 723操作系统总结(除课后计算题外) 2012年01月12日 ... -
Linux基础学习 收藏
2012-01-17 01:40 630Linux基础学习 收藏 2011年06月24日 Lin ... -
2011-9-13
2012-01-17 01:40 4972011-9-13 2011年09月13日 JavaSE ... -
linux共享内存
2012-01-17 01:40 638linux共享内存 2010年07月 ... -
JAVA经典32问
2012-01-17 01:40 502JAVA经典32问 2011年12月28 ... -
系统调用、POSIX、C库、系统命令和内核函数
2012-01-15 20:55 667系统调用、POSIX、C库、 ... -
AS3容器的实现原理
2012-01-15 20:55 911AS3容器的实现原理 2010年07月09日 所谓 ... -
【顶】FLASH教程――目录
2012-01-15 20:55 712【顶】FLASH教程――目录 2009年09月15日 追 ... -
【顶】flash教程――目录
2012-01-15 20:55 708【顶】flash教程――目录 2009年09月15日 F ...
相关推荐
NULL 博文链接:https://onestopweb.iteye.com/blog/2258477
//浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body)....
JS,Jquery获取各种屏幕的宽度和高度。
主要介绍了如何解决jQuery动态获取手机屏幕高和宽的问题,需要的朋友可以参考下
//浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body)....
介绍了JS和jquery获取各种屏幕的宽度和高度的代码,有需要的朋友可以参考一下
1、什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图。然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都...
1.17 获取鼠标在屏幕中的坐标 1.18 获取鼠标在窗口客户区中的坐标 1.19 获取鼠标在窗口页面中的坐标 1.20 设置Flash对象的WMode窗口模式 1.21 实现类Twitter的字数限制效果 1.22 提示文本的隐藏与显示 1.23 实现文字...
$("div").offset().top//是标签距离顶部高度(没有到下面的距离,比如$("div").offset().down) $("div").offset().left//是标签距离右边高度(没有到下面的距离,比如$("div").offset().right) $(document)....
jqueryOnScrollPosition是一个jquery插件,在窗口scrorll期间,仅获取DOM元素的顶部和底部位置,获取其高度并检查元素主体是否在屏幕上可见。 此插件与回调系统一起使用,它返回一个对象(带有一些布尔结果),该...
19 设置div在屏幕中央 $ document ready function { jQuery fn center function { this css "position" "absolute" ; this css "top" $ window height this height 2+$ window ...
默认是屏幕居中的,但是当页面出现滚动条时,dialog并没有随着滚动条往下滚动,这时就需要用户滑动滚动条来定位dialog,这不人性化,在说出解决方案前先来普及一下jquery关于定位的几个方法 代码如下: //获取浏览器...
原理很简单: 获取当前屏幕(窗体)的宽度和高度,因为不同浏览器的窗体大小是不一样的。有了这个,可以计算出来垂直居中的坐标。但是滑动了滚动条怎么依然垂直居中呢?这个时候就要获取当前窗体距离页面顶部的高度...
高度可定制且易于使用。 适用于从小型移动设备到大型台式机的多种屏幕分辨率。 立即查看实时预览,亲眼看看。 在上下载和预览 寻找高级模板? AdminLTE.IO刚刚打开了一个新的高级模板网站。 手工挑选,以确保最好...
KOglossaryLinks jQuery 插件这是一个 jQuery 插件,可在悬停(或在触摸屏设备上点击)时显示词汇表样式的工具提示。 您提供一个 json 提要并将数据属性添加到任何 HTML 元素,其余的工作将由它来完成。 该插件可以...
基于框架以及JS / jQuery插件。 高度可定制且易于使用。 适用于从小型移动设备到大型台式机的多种屏幕分辨率。 在预览 寻找高级模板? AdminLTE.io刚刚打开了一个新的高级模板页面。 手工挑选,以确保最好的质量...