scrollTop,scrollLeft
网页可见区域高: document.body.clientHeight;
网页可见区域宽: document.body.offsetWidth (包括边线的宽);
网页可见区域高: document.body.offsetHeight (包括边线的宽);
网页正文全文宽: document.body.scrollWidth;
网页正文全文高: document.body.scrollHeight;
网页被卷去的高: document.body.scrollTop;
网页被卷去的左: document.body.scrollLeft;
网页正文部分上: window.screenTop;
网页正文部分左: window.screenLeft;
屏幕分辨率的高: window.screen.height;
屏幕分辨率的宽: window.screen.width;
屏幕可用工作区高度: window.screen.availHeight;
屏幕可用工作区宽度:window.screen.availWidth;
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量
Post by molong on 2009-05-19 11:57 PM #1
要获取当前页面的滚动条纵坐标位置,用:
document.documentElement.scrollTop;
而不是:
document.body.scrollTop;
documentElement 对应的是 html 标签,而 body 对应的是 body 标签。
在标准w3c下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop来代替;
如果你想定位鼠标相对于页面的绝对位置时,你会发现google里面1000篇文章里面有999.99篇会让你使用 event.clientX+document.body.scrollLeft,event.clientY+document.body.scrollTop, 如果你发现你的鼠标定位偏离了你的想象,请不要奇怪,这是再正常不过的事情。
ie5.5之后已经不支持document.body.scrollX对象了。
所以在编程的时候,请加上这样的判断
if (document.body && document.body.scrollTop && document.body.scrollLeft)
{
top=document.body.scrollTop;
left=document.body.scrollleft;
}
if (document.documentElement && document.documentElement.scrollTop && document.documentElement.scrollLeft)
{
top=document.documentElement.scrollTop;
left=document.documentElement.scrollLeft;
}
scrollTop,scrollLeft的更多相关文章
- offset() position() scrollTop() scrollLeft()
(1)offset:获取当前元素相对于文档的高度.只对可见元素有效. 不管该元素如何定位,也不管其父元素如何定位,都是获取的该元素相对于当前视口的偏移 (2) position:获取元素相对于最近的一 ...
- 一句话解释jquery中offset、pageX, pageY、position、scrollTop, scrollLeft的区别
offset 元素相对文档的偏移 pageX, pageY 事件(鼠标)相对文档的偏移 注意:文档是指document, 而不是当前窗口,是包含了滚动位置的,即滚动条的位置对这些值是不产生影响的 ...
- jQuery css,position,offset,scrollTop,scrollLeft用法
jQuery css,position,offset,scrollTop,scrollLeft用法: <%@ page language="java" import=&quo ...
- JS中的offsetWidth/offsetHeight/offsetTop/offsetLeft、clientWidth/clientHeight/clientTop/clientLeft、scrollWidth/scrollHeight/scrollTop/scrollLeft
这是一组非常容易弄混的参数!都是描述某个盒子元素的宽度.高度以及上或左的距离偏移量. 1. offsetWidth / offsetHeight(不包括外边距) offsetWidth:返回元素的宽度 ...
- 一文看懂js中元素的滚动大小(scrollWidth,scrollHeight,scrollTop,scrollLeft)
滚动大小(scroll dimension) 滚动大小指的是包含滚动内容元素的大小. 以下是与元素滚动内容大小相关的属性: 1. scrollWidth:在没有滚动条的情况下,元素内容的总宽度. 2. ...
- JS clientHeight,scrollHeight,offsetHeight,scrollTop,offsetTop概念
JS滚动页面到某一位置时触发指定事件能够增强用户体验或是提高性能,其中使用最多的场景是加载更多,当鼠标滚动至页面下方时,自动加载下一页的内容.另一个常用的场景是当用户滚动至页面某一地方时,页面会给出提 ...
- 搞懂offsetY、offsetTop、scrollTop、offsetHeight、scrollHeight
先搞offsetTop,最难懂的就是它了 官方解释:返回当前元素的上边界到它的包含元素的上边界的偏移量,以像素为单位.这真TM坑爹啊!有木有!经过仔细研究查找得出结论:offsetTop是相对于离它最 ...
- JS关于scrollTop和可视区域clientWidth
一.scrollTop,scrollLeft 要获得页面的scrollTop及scrollLeft,在不同的浏览器中是不一样的: 谷歌浏览器和没声明DTD的文档,通过document.body.scr ...
- js和jq中常见的各种位置距离之offsetLeft/clientLeft/scrollLeft (一)
offsetLeft offsetTop offsetWidth offsetHeight offsetLeft:元素的边框的外边缘距离与已定位的父容器(offsetparent)的左边距离(不包括元 ...
随机推荐
- MySQL FROM 子查询
FROM 子句中的子查询 MySQL FROM 子查询是指 FROM 的子句作为子查询语句,主查询再到子查询结果中获取需要的数据.FROM 子查询语法如下: SELECT ... FROM (subq ...
- [转]SGI STL 红黑树(Red-Black Tree)源代码分析
STL提供了许多好用的数据结构与算法,使我们不必为做许许多多的重复劳动.STL里实现了一个树结构-Red-Black Tree,它也是STL里唯一实现的一个树状数据结构,并且它是map, multim ...
- CentOS 6.3安装配置LAMP服务器(Apache+PHP5+MySQL)
准备篇: 1.配置防火墙,开启80端口.3306端口 vi /etc/sysconfig/iptables -A INPUT -m state --state NEW -m tcp -p tcp -- ...
- php发送post请求的三种方法示例
本文分享下php发送post请求的三种方法与示例代码,分别使用curl.file_get_content.fsocket来实现post提交数据,大家做个参考. php发送post请求的三种方法,分别使 ...
- 转:Yelp开发团队发布内部网站设计指南
原文来自于:http://www.infoq.com/cn/news/2014/02/yelp-style-guide 近日,Yelp开发团队在博客发布消息:Yelp公开了内部网站设计指南.这份文档此 ...
- 转:对于linux下system()函数的深度理解(整理)
这几天调程序(嵌入式linux),发现程序有时就莫名其妙的死掉,每次都定位在程序中不同的system()函数,直接在shell下输入system()函数中调用的命令也都一切正常.就没理这个bug,以为 ...
- Entity Framework with MySQL 学习笔记一(安装)
声明 : 数据库是Mysql,本人的程度只到会写sql语句(不会储蓄过程), c# 会基本的ADO.NET数据库访问,LINQ基础. 这篇只做个人学习|温习作用. 新手可以参考,也请高手指正错误, ...
- xcode安装
Xcode5.1默认不支持iOS5版本的模拟器开发调试,在OS X Mavericks(10.9.x)下默认只能支持iOS6.1及以上版本的模拟器,在OS X Mountain Lion(10.8.x ...
- android中操作SQLite注意事项
调用rawQuery()后,需要调用Cursor的movToFirst(); public Cursor query(String sql, String[] args){ SQLiteDatabas ...
- java与数据结构(6)---java实现链栈
栈之链式存储结构链栈 链栈 栈的链式存储结构成为链栈.链栈是没有头结点,头结点就是栈顶指针top. 代码结构 package list; public interface Stackable;公共接口 ...