jquery
$(function(){
/调整窗口自动调整宽度/
$(window)resize(function(){
var h = $(window)height();
var w = $(window)width();
consoleinfo("窗口高度：" + h + "; 窗口宽度：" + w);
});
});
jquery:
高度：$(window)height()
宽度：$(window)width();
浮动定位：$(option)css({top:(($(window)height()-$(option)height())/2)+'px'})
option 为你的浮动框识别class或识别id
js获取浏览器可见区域(不包括标题栏、地址栏、收藏夹栏状态栏等额外区域，仅为页面呈现区域)的高度和宽度
宽度:documentdocumentElementclientWidth
高度:documentdocumentElementclientHeight
文档类型:XHTML10
浏览器:ALL
获取代码如下：
<script>
var w=documentdocumentElementdocumentdocumentElementclientHeight:documentbodyclientHeight;
alert(w);
</script>
获取浏览器的高度：jquery代码直接使用 $(window)height()。
获取浏览器的宽度：
jquery代码直接使用 $(window)With();
原生态JS代码：
var w=documentdocumentElementdocumentdocumentElementclientWidth:documentbodyclientWidth。
function autodivheight() { //函数：获取尺寸
//获取浏览器窗口高度
var winHeight = 0;
if (windowinnerHeight) {
winHeight = windowinnerHeight;
} else if ((documentbody) && (documentbodyclientHeight)) {
winHeight = documentbodyclientHeight;
}
//通过深入Document内部对body进行检测，获取浏览器窗口高度
if (documentdocumentElement && documentdocumentElementclientHeight) {
winHeight = documentdocumentElementclientHeight;
}
//DIV高度为浏览器窗口的高度
documentgetElementById("login_body")styleheight = winHeight + "px";
}
//浏览器窗口变化时
windowonresize = function () {
autodivheight(); //浏览器窗口发生变化时同时变化DIV高度
}
//浏览器重新加载时
windowonload = function () {
autodivheight(); //浏览器窗口发生变化时同时变化DIV高度
}
<html>
<head>
</head>
<body style="height:400px">
<div id="div1">12312</div>
<script type="text/javascript">
documentgetElementById("div1")styleheight=documentbodystyleheight;
alert(documentgetElementById("div1")styleheight);
//如果body，没有设置样式，这个高度就为空
documentgetElementById("div1")styleheight=documentbodyclientHeight
alert(documentgetElementById("div1")styleheight);
//如果设置了样式，offsetHeight就等于样式的height否则等于clientHeight
documentgetElementById("div1")styleheight=documentbodyoffsetHeight
alert(documentgetElementById("div1")styleheight);
</script>
</body>
</html>
要在js中获得浏览器的高度可以参考以下步骤(具体代码见最后）：
1、outerHeight属性设置或返回一个窗口的外部高度，包括所有界面元素（如工具栏/滚动条）。
2、outerWidth属性设置或返回窗口的外部宽度，包括所有的界面元素（如工具栏/滚动）。
3、innerheight 返回窗口的文档显示区的高度。
4、innerwidth 返回窗口的文档显示区的宽度。
补充：
在浏览器兼容方面：
1、所有主流浏览器都支持 outerWidth 和 outerHeight 属性。
注意：IE 8 及更早 IE 版本不支持该属性。
2、所有主流浏览器都支持 innerWidth 和 innerHeight 属性。
注意：IE 8 及更早 IE版本不支持这两个属性。
获取代码：
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 10 Transitional//EN"
<head>
<title>请调整浏览器窗口</title> <meta >
以上就是关于js或者jquery如何实时获取浏览器的高度和宽度的全部的内容，包括:js或者jquery如何实时获取浏览器的高度和宽度的、JS如何获取浏览器有效宽度和高度、js 如何获取浏览器的高度等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）