jquery获取浏览器的宽度和高度怎么做的为啥$(window).width()不行呢_框架

jq不会出现这样的问题的，检查下代码存放位置是否正确。另外您的jq是什么版本的？另外如果实在取不到那就用这个

网页可见区域宽： documentbodyclientWidth

网页可见区域高： documentbodyclientHeight

网页可见区域宽： documentbodyoffsetWidth (包括边线的宽)

网页可见区域高： documentbodyoffsetHeight (包括边线的高)

网页正文全文宽： documentbodyscrollWidth

网页正文全文高： documentbodyscrollHeight

网页被卷去的高： documentbodyscrollTop

网页被卷去的左： documentbodyscrollLeft

网页正文部分上： windowscreenTop

网页正文部分左： windowscreenLeft

屏幕分辨率的高： windowscreenheight

屏幕分辨率的宽： windowscreenwidth

屏幕可用工作区高度： windowscreenavailHeight

屏幕可用工作区宽度： windowscreenavailWidth

。。。。

documentbodyclientWidth 用这个原生的比jq快得快

jQuery 获取屏幕高度、宽度

做手机Web开发做浏览器兼容用到了，所以在网上找了些汇总下。

alert($(window)height()); //浏览器当前窗口可视区域高度

alert($(document)height()); //浏览器当前窗口文档的高度

alert($(documentbody)height());//浏览器当前窗口文档body的高度

alert($(documentbody)outerHeight(true));//浏览器当前窗口文档body的总高度包括border padding margin

alert($(window)width()); //浏览器当前窗口可视区域宽度

alert($(document)width());//浏览器当前窗口文档对象宽度

alert($(documentbody)width());//浏览器当前窗口文档body的高度

alert($(documentbody)outerWidth(true));//浏览器当前窗口文档body的总宽度包括border padding margin

// 获取页面的高度、宽度

function getPageSize() {

var xScroll, yScroll;

if (windowinnerHeight && windowscrollMaxY) {

xScroll = windowinnerWidth + windowscrollMaxX;

yScroll = windowinnerHeight + windowscrollMaxY;

} else {

if (documentbodyscrollHeight > documentbodyoffsetHeight) { // all but Explorer Mac

xScroll = documentbodyscrollWidth;

yScroll = documentbodyscrollHeight;

} else { // Explorer Macwould also work in Explorer 6 Strict, Mozilla and Safari

xScroll = documentbodyoffsetWidth;

yScroll = documentbodyoffsetHeight;

}

var windowWidth, windowHeight;

if (selfinnerHeight) { // all except Explorer

if (documentdocumentElementclientWidth) {

windowWidth = documentdocumentElementclientWidth;

} else {

windowWidth = selfinnerWidth;

}

windowHeight = selfinnerHeight;

} else {

if (documentdocumentElement && documentdocumentElementclientHeight) { // Explorer 6 Strict Mode

windowWidth = documentdocumentElementclientWidth;

windowHeight = documentdocumentElementclientHeight;

} else {

if (documentbody) { // other Explorers

windowWidth = documentbodyclientWidth;

windowHeight = documentbodyclientHeight;

}

// 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;

}

// 滚动条

documentbodyscrollTop;

$(document)scrollTop();

现在电脑的浏览器基本上都是宽屏，常见的都在1440以上，在PS中宽为1000-1200像素最为合适，你可以参考新浪、网易等门户网站的宽度值。

下面，是几点分辨率在不同时期的参考值。

1、屏幕分辨率低时(640 x 480)，这是2000年左右，普遍的浏览器是这个分辨率，但已经被淘汰了。

2、接是1024x768的分辨率，很流行，实际在设计中，在PHOTOSHOP宽的设计值为760像素最合适。

3、随着现在宽屏时代的到来，1024也慢慢被淘汰了，现在都是大屏时代，基本上，从设计网页的角度来看，在PHOTOSHOP上，宽为1000像素最为合适。

4、随现在浏览的工具越来越多，包括手机、IPAD等，出现了自适应的网页设计功能，需要HTML5及DIV+CSS的代码调用了。

目前来讲html不具备获取浏览器宽度的能力。可以采用js的方式来获取，具体示例JS代码如下：

// 获取窗口宽度

if (windowinnerWidth)

winWidth = windowinnerWidth;

else if ((documentbody) && (documentbodyclientWidth))

winWidth = documentbodyclientWidth;

// 获取窗口高度

if (windowinnerHeight)

winHeight = windowinnerHeight;

else if ((documentbody) && (documentbodyclientHeight))

winHeight = documentbodyclientHeight;

// 通过深入 Document 内部对 body 进行检测，获取窗口大小

if (documentdocumentElement && documentdocumentElementclientHeight && documentdocumentElementclientWidth)

{

winHeight = documentdocumentElementclientHeight;

winWidth = documentdocumentElementclientWidth;

}

可以使用offset()方法来获取元素距离浏览器的边距，offset()

方法返回或设置匹配元素相对于文档的偏移（位置）。

工具原料：编辑器、浏览器

1、首先设置一个div然后使用offset()方法来获取其距离浏览器顶部的高度，简单的代码示例如下：

alert($('div')offset()top);

</script>

</body>

2、因为div距离顶部的距离是100像素，所以d出的应该是100，如下图：

//js部分

$(document)ready(function() {

$("#button")click(function() {

alert("高："+$(document)height()+" 宽："+$(document)width());

});

});

你真确定不好使？检查一下jquery路径吧。

alert($(window)height()); //浏览器时下窗口可视区域高度

alert($(document)height()); //浏览器时下窗口文档的高度

alert($(documentbody)height());//浏览器时下窗口文档body的高度

alert($(documentbody)outerHeight(true));//浏览器时下窗口文档body的总高度包括border padding margin

alert($(window)width()); //浏览器时下窗口可视区域宽度

alert($(document)width());//浏览器时下窗口文档对于象宽度

alert($(documentbody)width());//浏览器时下窗口文档body的高度

alert($(documentbody)outerWidth(true));

以上就是关于jquery获取浏览器的宽度和高度怎么做的为啥$(window).width()不行呢全部的内容，包括:jquery获取浏览器的宽度和高度怎么做的为啥$(window).width()不行呢、怎么样获取屏幕的高度 jquery、一个浏览器窗口的宽度和高度的px是多少等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/9803420.html

jquery获取浏览器的宽度和高度怎么做的为啥$(window).width()不行呢

发表评论

评论列表（0条）