jQuery(window).height()代表了当前可见区域的大小,而jQuery(document).height()则代表了整个文档的高度,可视具体情况使用.
注意当浏览器窗口大小改变时(如最大化或拉大窗口后) jQuery(window).height() 随之改变,但是jQuery(document).height()是不变的。
$(document).scrollTop() 获取垂直滚动的距离 即当前滚动的地方的窗口顶端到整个页面顶端的距离
$(document).scrollLeft() 这是获取水平滚动条的距离
要获取顶端 只需要获取到scrollTop()==0的时候 就是顶端了
要获取底端 只要获取scrollTop()>=$(document).height()-$(window).height() 就可以知道已经滚动到底端了
$(document).height() //是获取整个页面的高度
$(window).height() //是获取当前 也就是你浏览器所能看到的页面的那部分的高度 这个大小在你缩放浏览器窗口大小时 会改变 与document是不一样的 根据英文应该也能理解吧
自己做个实验就知道了
$(document).scroll(function(){
$("#lb").text($(document).scrollTop());
})
<span id="lb" style="top:100px;left:100px;position:fixed;"></span><!--一个固定的span标记 滚动时方便查看-->
分享到:
相关推荐
- **window.screen.height** 和 **window.screen.width**: 屏幕分辨率的高度和宽度。 - **window.screen.availHeight** 和 **window.screen.availWidth**: 可用工作区的高度和宽度。 ##### 3. 兼容性问题 - 在不同...
前言:公司项目需要用到一个弹框垂直居中,网上类似的垂直居中弹出层大同小异,因为项目是基于Jquery 下的,所以用$(window).height()-layer.height())/2 +$(document).scrollTop()取得垂直的位移。测了各种浏览器没...
### JS与jQuery获取屏幕宽度和高度的相关知识点 在前端开发中,经常需要获取用户的屏幕尺寸信息,例如宽度和高度等,这些数据对于响应式设计、布局调整等方面具有重要作用。通过JavaScript(简称JS)和jQuery这两种...
在JavaScript的世界里,`window`对象是全局对象,它提供了与浏览器窗口进行交互的各种方法和属性。本篇文章将深入探讨`window.open()`、`window.opener`、`window.name`以及`window`对象的一些核心概念,同时通过两...
$("#content").height(windowHeight - headerHeight - footerHeight); } // 初始设置 setHeight(); // 监听窗口大小变化 $(window).on('resize', function() { // 使用防抖或节流技术可在此处添加 set...
if ($window.scrollTop() + windowHeight >= $(document).height()) { $window.scrollTop(0); } }); $window.animate({ scrollTop: $(document).height() }, 2000); ``` 这段代码首先获取窗口的高度和文档的总...
`$(window).height()`与`$(document).height()`的区别 这两个函数返回的是不同的高度值: - `$(window).height()`:返回浏览器窗口可视区域的高度,即用户当前能看到的页面部分的高度。这个值会随着浏览器窗口...
windowHeight = document.documentElement.clientHeight; } else if (document.body) { windowHeight = document.body.clientHeight; } // for small pages with total height less then height of the ...
var height1 = window.screen.availHeight - (window.screenTop + (window.screen.height - window.screen.availHeight)); var top = document.getElementById("top").offsetHeight; var foot = document....
newHeight = $(window).height() - (event.clientY - $(window).scrollTop()); newHeight = Math.max(100, newHeight); $('#popup').height(newHeight); break; case 'width': newWidth = $(window).width() -...
在有滚动条的情况下,`$(document).height()` 通常会大于 `$(window).height()`。 下面是一个简单的示例,演示如何获取并比较这两个高度: ```javascript $(document).ready(function() { var docHeight = $...
$("#myElement").css("height", windowHeight); }); ``` 在这个示例中,当窗口大小改变时,元素的高度将自动调整为与窗口高度相同。 同时,jQuery 提供的 `$(document).ready()` 函数确保在页面加载完成后再执行...
2. **$(document).height()**: 与$(window).height()不同,$(document).height()返回整个HTML文档的高度,包括用户当前无法看到的部分(超出可视区域的部分)。即使用户滚动页面,这个值始终保持不变,因为它表示...
var scale = Math.min(windowWidth / imgWidth, windowHeight / imgHeight); // 设置新的尺寸 $('#yourImage').css({ width: imgWidth * scale, height: imgHeight * scale }); }); ``` 3. 缩放动画:...
$(window).height();//是文档窗口高度 $("div").offset().top//是标签距离顶部高度(没有到下面的距离,比如$("div").offset().down) $("div").offset().left//是标签距离右边高度(没有到下面的距离,比如$("div")...
jquery获取窗口高度和窗口高度,$(document).height()、$(window).height() $(document).height():整个网页的文档高度 $(window).height():浏览器可视窗口的高度 $(window).scrollTop():浏览器可视窗口顶端...
$(document).ready(function(){$(window).resize();}); $(window).resize(function(){var canvas = document.getElementById(“ theCanvas”); //重新调整画布的大小以适合整个屏幕。在这里,请...
用一句话理解就是:当网页滚动条拉到最低端时,$(document).height() == $(window).height() + $(window).scrollTop()。 当网页高度不足浏览器窗口时$(document).height()返回的是$(window).height()。 不建议使用$...