Javascript 获取滚动条位置等信息的函数
更新时间：2009年09月08日 22:49:19 作者：
有时为了准确定位一个元素，我们需要获取滚动条的位置，这种需求经常出现在 tooltip 和 拖放等应用中，其实这个技术很简单，关键是要考虑浏览器的兼容性，本文就是介绍这一问题的解决方法。
其实这段代码在之前的 “ 用 Javascript 实现锚点(Anchor)间平滑跳转” 一文已经介绍过了，但是由于这个需求并且经常用到，因此，本站专门发布此文介绍，方便查阅。
<script type="text/javascript">
// 说明：用 Javascript 获取滚动条位置等信息
// 来源 ：ThickBox 2.1
function getScroll()
{
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 { t: t, l: l, w: w, h: h };
}
</script>
复制代码 代码如下:
<script type="text/javascript">
// 说明：用 Javascript 获取滚动条位置等信息
// 来源 ：ThickBox 2.1
function getScroll()
{
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 { t: t, l: l, w: w, h: h };
}
</script>
相关文章
js自执行函数的几种不同写法的比较,需要的朋友可以参考下2012-08-08
这篇文章主要介绍了原生JS 实现的input输入时表格过滤操作,结合实例形式分析了JavaScript基于页面元素遍历、运算、判断实现的表格过滤相关操作技巧,需要的朋友可以参考下2019-08-08
这次为大家带来的小游戏是：打飞机。呃。。。我本人就写不出什么惊天大作的游戏的了，只能写写小游戏，代码量小，又可以学习，主要是想法思路，代码量大，估计也没啥人会去研究学习。。。2010-10-10
这篇文章主要介绍了JavaScript柯里化函数式编程，JS柯里化是前端面试中最常见的问题之一，它可以让你的代码更简洁，工作更高效，感兴趣想要详细了解可以参考下文2023-05-05
three.js和tween.js可以一起使用,实现复杂的动画效果,包括飞线动画,这篇文章主要给大家介绍了关于Threejs与Tween.js结合创建动画的相关资料,需要的朋友可以参考下2024-01-01
由于WEBIM处在独立页面,所以如果多次点击就会出现多个页面,本文将介绍详细的解决方法，需要了解的朋友可以参考下2012-12-12
百度地图JavascriptApi Marker平滑移动及车头指向行径方向
本文主要介绍了百度地图JavascriptApi Marker平滑移动及车头指向行径方向的相关知识。具有很好的参考价值。下面跟着小编一起来看下吧2017-03-03
请注意，这里说的是运算数的求值顺序。而非运算符，运算符的求值顺序我们比较熟悉。2011-08-08
JavaScript中call、apply、bind实现原理详解
其实在很多文章都会写call，apply，bind,但个人觉着如果不弄懂原理,是很难理解透的,所以这篇文章主要介绍了JavaScript中call、apply、bind实现原理的相关资料,需要的朋友可以参考下2021-06-06
这篇文章主要介绍了antDesign 自定义分页样式的实现代码，这里用到了自定义指令,如果大家用不到可以按照自己的实际效果开发,本文通过实例代码给大家详细讲解，需要的朋友可以参考下2022-10-10
最新评论