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获取屏幕的高度和宽度，这对于创建响应式网页设计或者根据屏幕尺寸调整元素布局至关重要。 首先，我们需要了解什么是屏幕高度和宽度。屏幕高度是指浏览器窗口可视区域的垂直尺寸，而...
### JS与jQuery获取屏幕宽度和高度的相关知识点 在前端开发中，经常需要获取用户的屏幕尺寸信息，例如宽度和高度等，这些数据对于响应式设计、布局调整等方面具有重要作用。通过JavaScript（简称JS）和jQuery这两种...
首先，`$(window).height()` 和 `$(window).width()` 是用来获取浏览器当前窗口可视区域的高度和宽度，也就是用户在屏幕上看到的网页部分，不包括滚动条。例如，在提供的代码中，`$(window).height()` 返回的是267...
//浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body)....
总的来说，"jQuery自适应父容器宽度高度代码"是利用jQuery动态计算和调整文本字体大小的示例，以实现文本在各种屏幕尺寸下的良好展示。通过对HTML、CSS和JavaScript的深入理解，我们可以创建出更灵活、更具适应性的...
以下是对标题"JQuery获取当前屏幕的高度宽度的实现代码"以及描述中所涉及知识点的详细解释。 1. **jQuery基础**： jQuery是一个JavaScript库，它简化了HTML DOM遍历、事件处理、动画制作以及Ajax交互。使用`$`符号...
当试图在页面加载时立即获取屏幕高度以实现全屏滚动效果时，初次加载时可能无法获取到正确的高度，而刷新后因为浏览器缓存了之前的状态，所以能正确获取。这说明获取屏幕尺寸需要在DOM完全加载之后进行。 为了解决...
在本文中，我们将深入探讨如何使用jQuery实现一个自适应宽度和高度的相册代码，这是Jquery经典特效系列中的第18个主题。这个特效对于现代网页设计至关重要，因为它允许图片展示在不同屏幕尺寸和设备上都能保持良好的...
在网页开发中，获取屏幕、窗口以及网页内容的宽度和高度是常见的需求，这有助于我们进行响应式设计或者实现特定的交互效果。本篇将详细解释JavaScript和jQuery中获取这些尺寸的方法。 首先，我们来看看JavaScript...
本文将详细讲解如何使用JQuery实现图片的自适应宽度以及表格List的自适应屏幕宽度。 首先，让我们关注JQuery图片自适应宽度的实现。JQuery是一种强大的JavaScript库，它简化了DOM操作，事件处理和动画效果。要使...
本教程将详细讲解如何利用jQuery实现一个自适应宽度和高度的相册代码，以适应不同屏幕尺寸和设备。 首先，我们需要理解自适应布局的核心理念。自适应网页设计（Responsive Web Design，简称RWD）是一种让网站在不同...
在JavaScript中，获取浏览器的高度和宽度是常见的需求，用于适应不同的屏幕尺寸和实现响应式设计。然而，由于不同浏览器之间的差异，获取这些值的方法并不统一。本文将详细介绍如何在多种浏览器环境下，包括IE、Fire...
- 如果图片的真实宽度大于浏览器宽度，可以将图片的宽度设置为100%，高度自适应，以确保图片能够适应屏幕宽度而不失真。 - 如果图片宽度小于浏览器宽度，可以设置图片宽度和高度为原始尺寸，以保证图片展示的精细度...
在JavaScript部分，jQuery提供了一系列的方法来获取和改变元素的属性，如宽度和高度。当窗口大小发生变化时，通过`$(window).resize()`函数监听窗口大小的变化，并根据新的窗口宽度调整相册的布局。同时，`$...
在JavaScript中，获取浏览器窗口、屏幕以及网页的高度和宽度是常见的需求，这在网页布局、动态调整元素尺寸、响应式设计等方面非常有用。以下是一些关键的JavaScript属性和方法，用于获取这些信息： 1. **网页可见...