oEvent.clientX 是指鼠标到可视区左边框的距离。

oEvent.clientY 是指鼠标到可视区上边框的距离。


clientWidth  是指可视区的宽度。

clientHeight  是指可视区的高度。

clientLeft  是指左边框的宽度。

clientTop  是指上边框的宽度。

获取可视区的宽高:
　　document.documentElement.clientWidth
　　document.documentElement.clientHeight


offsetWidth  是指div的宽度（包括div的边框）

offsetHeight  是指div的高度（包括div的边框）

offsetLeft  是指div到整个页面左边框的距离（不包括div的边框）

offsetTop  是指div到整个页面上边框的距离（不包括div的边框）

scrollTop  是指可视区顶部边框与整个页面上部边框的看不到的区域。

scrollLeft  是指可视区左边边框与整个页面左边边框的看不到的区域。

scrollWidth  是指左边看不到的区域加可视区加右边看不到的区域即整个页面的宽度（包括边框）

scrollHeight  是指上边看不到的区域加可视区加右边看不到的区域即整个页面的高度（包括边框）

向上滚动的距离scollTop的兼容性写法：
　　document.documentElement.scrollTop || document.body.scrollTop

scroll offset & client总结的更多相关文章

  1. Html 中scroll offset client 总结

    HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对 ...

  2. JavaScript中的 offset, client,scroll

    在js 中我们要用到的 offset, client, scroll 在这我把自己理解的给大家分享一下. offset div.offsetTop 指div距离上方或上层控件的距离,单位像素 div. ...

  3. client/scroll/offset width/height/top/left ---记第一篇博客

    client/scroll/offset width/height/top/left (盒模型为contentBox,定位原点是元素左上角边框最外层的交点) clientWidth  width+左p ...

  4. offset/client/scroll一些总结

    offset/client/scroll一些总结 1.offset 首先offset共有五个值 1.offsetParent 2.offsetTop 3.offsetLeft 4.offsetWidt ...

  5. javascript中常用坐标属性offset、scroll、client

    原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...

  6. scroll、client和offset的区别

    scroll.client和offset的区别:http://www.cnblogs.com/pcd12321/p/4448420.html

  7. 三大家族(offset、scroll、client)

    offset.scroll.client三大家族 offset家族 offsetWidth 与 offsetHeight offset 偏移 用于获取元素自身的位置和大小 offsetWidth和of ...

  8. JS 中的offset、scroll、client总结

    经常碰到offset.scroll.client这几个关键字,每次都要各种实验,这里总结一下. 两张图镇楼,随时翻阅 1. offset offset 指偏移,包括这个元素在文档中占用的所有显示宽度, ...

  9. 关于scroll、client、offset和style中的height、width、top以及bottom属性

    内容和图片来自offset.scroll.client三大家族, 此处仅作记录使用 client offset scroll

随机推荐

  1. 平衡二叉树、B树、B+树、B*树、LSM树简介

    平衡二叉树是基于分治思想采用二分法的策略提高数据查找速度的二叉树结构.非叶子结点最多只能有两个子结点,且左边子结点点小于当前结点值,右边子结点大于当前结点树,并且为保证查询性能增增删结点时要保证左右两 ...

  2. Linux Bash 提示符的一些骚年操作

    当你在 Linux 环境下打开一个 Shell 终端时,会看到命令行中出现了类似下面的一个 Bash 提示符: 百牛信息技术bainiu.ltd整理发布于博客园[user@$host ~]$1[use ...

  3. PostgreSQL 图形化客户端工具有哪些

    linux下有字符界面的:psql         图形界面的:pgaccesswindows系统可以用:phpPgAdmin或者telnet+psql 和phpmyadmin 一家的phpPgAdm ...

  4. C++实现查找链表中环的入口节点

    /* * 寻找链表中环的入口节点.cpp * * Created on: 2018年4月10日 * Author: soyo */ #include<iostream> using nam ...

  5. 任务37：生成 JWT Token

    实现给用户办法token 默认是可以访问valuesController的,返回的状态是200 http://localhost:5429/api/values 返回的状态码是200 把ValuesC ...

  6. 注册CSDN账号的尴尬

    因为新浪博客这里代码显示不大好用,打算把关于编程和应用开发的东西改到那里去写,可是点击注册....   竟然要输入手机号,无法跳过.... 要知道,楼主现在可是在国外,压根没有可用于注册的手机号啊.. ...

  7. bzoj 3513: [MUTC2013]idiots【生成函数+FFT】

    想了好长时间最后发现真是石乐志 第一反应就是两边之和大于第三边,但是这个东西必须要满足三次-- 任意的两边之和合通过生成函数套路+FFT求出来(记得去掉重复选取的),然后这任意两边之和大于任意第三边可 ...

  8. C# 多线程（转）

    C#多线程   一.基本概念 1.进程 首先打开任务管理器,查看当前运行的进程: 从任务管理器里面可以看到当前所有正在运行的进程.那么究竟什么是进程呢? 进程(Process)是Windows系统中的 ...

  9. 香港药品 ref

    --公牛牌风湿骨刺丹30粒 参考网站--http://item.jd.com/1955815605.html?gjz=0#comments-list 88 --参考网站1,没有 http://www. ...

  10. 1. Visio Web 形状 - 无法与 Web 服务器建立连接。请稍后重新进行搜索。处理方式

    今天在Visio中使用“搜索形状”,发现不管搜什么,结果都是:Visio Web 形状 - 无法与 Web 服务器建立连接.请稍后重新进行搜索 具体解决方案如下:控制面板=>添加或删除程序=&g ...