jquery ,Javascript 获取滚动条高度和位置, 元素距页头高度

Posted 2020-08-15

jQuery写法：
获取览器显示区域的高度 ： $(window).height(); 
获取浏览器显示区域的宽度 ：$(window).width();
获取页面的文档高度 ：$(document).height();
获取页面的文档宽度 ：$(document).width();

获取滚动条到顶部的垂直高度 ：$(document).scrollTop()=$(window).scrollTop()
获取滚动条到左边的垂直宽度 ：$(document).scrollLeft()=$(window).scrollLeft()
相同的效果,但是$(window).scrollTop()被所有浏览器支持.
参考这个 

javascript写法：
function ScollPostion() {//滚动条位置
var t, l, w, h;
if (document.documentElement && document.documentElement.scrollTop) {
t = document.documentElement.scrollTop;
l = document.documentElement.scrollLeft;
w = document.documentElement.scrollWidth;
h = document.documentElement.scrollHeight;
} else if (document.body) {
t = document.body.scrollTop;
l = document.body.scrollLeft;
w = document.body.scrollWidth;
h = document.body.scrollHeight;
}
return { top: t, left: l, width: w, height: h };
}

元素距离页面顶部距离:

Javascipt写法：

document.getElementById("elt_id").offsetTop;

jQuery写法：

$("#elt_id").offset().top;

本文出自 “ThinkPHP学习笔记” 博客，谢绝转载！