clientX、pageX、scrollLeft、offsetLeft、clientWidth、screen.width的用法和区别
一.定义和用法
1.event.clientX:事件对象的水平偏移量;
event.clientY:事件对象的垂直偏移量;
2.event.pageX:事件对象加上滚动距离后的水平偏移量;
event.pageY:事件对象加上滚动距离后的垂直偏移量;
3.$(selector).scrollLeft(offset):获得或设置对象的滚动水平位置;
$(selector).scrollTop(offset):获得或设置对象的滚动垂直位置;
4.div.offsetLeft:对象的水平偏移量;
div.offsetTop:对象的垂直偏移量;
5.div.clientWidth:对象的宽度;
div.clientHeight:对象的高度;
6.screen.width:整个屏幕宽度;
screen.height:整个屏幕高度;
二、图片如下:

clientX、pageX、scrollLeft、offsetLeft、clientWidth、screen.width的用法和区别的更多相关文章
- clientX,pageX,screenX,offsetLeft,scrollTop
出处:点击打开链接 一直不太明白,今天看了一下,感觉挺详细,先转载过来....... clientX 观点:鼠标相对于WINDOWS的坐标. 这里这个WINDOWS是指我们能看见的浏览器大小.所以不可 ...
- 理解screenX clientX pageX概念
先了解screenX,clientX,pageX概念 screenX: 鼠标位置相对于用户屏幕水平偏移量,而screenY就是垂直方向的,此时的参照点也就是原点是屏幕的左上角. clientX: 跟s ...
- HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对 ...
- 网页Screen width、height、availWidth、availHeight属性
*screen.width 功能:声明了显示浏览器的屏幕的宽度,以像素计. 语法:screen.width *screen.height 功能:声明了显示浏览器的屏幕的可用宽度,以像素计. 语法:sc ...
- 元素间距属性(scrollLeft,scrollWidth,clientWidth,offsetWidth,padding,margin)
scrollHeight: 获取对象的滚动高度.scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端 ...
- 转 scrollLeft,scrollWidth,clientWidth,offsetWidth之完全详解
scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最 ...
- HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth之完全详解
HTML:scrollLeft,scrollWidth,clientWidth,offsetWidth到底指的哪到哪的距离之完全详解 scrollHeight: 获取对象的滚动高度. scrollLe ...
- HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth之全然具体解释
HTML:scrollLeft,scrollWidth,clientWidth,offsetWidth究竟指的哪到哪的距离之全然具体解释scrollHeight: 获取对象的滚动高度. scrol ...
- H5,PC网页屏幕尺寸相关整理(scrollLeft,scrollWidth,clientWidth,offsetWidth)
HTML:scrollLeft,scrollWidth,clientWidth,offsetWidth到底指的哪到哪的距离之完全详解scrollHeight: 获取对象的滚动高度. scrollLef ...
随机推荐
- Fragment的使用(二)
动态添加Fragment 将MainActivity的布局文件中的两个Fragment的代码注释掉.在MainActivity的java文件中添加如下代码: package com.cm.myfrag ...
- (转) 浅析HTML5在移动应用开发中的使用
(转)浅析HTML5在移动应用开发中的使用 (原)http://www.iteye.com/magazines/67 2012-03-07 来自 UECD.163.com 编辑 wangguo ...
- Android 终于官方支持按百分比来设置控件的宽高了
dependencies { compile 'com.android.support:percent:22.2.0' } 支持布局 PercentRelativeLayout <android ...
- iOS UITableViewCell滑动删除
一般我们使用列表的形式展现数据就会用到UITableView.在熟练掌握了用UITableView展示数据以后,开发过程中可能会遇到需要删除数据的需求,我们想实现在一行数据上划动一下,然后出现一个删除 ...
- ajax的status为201依然触发jquery的error事件的问题
昨天在调试一个ajax的时候发现,即使status是201,仍然会触发jquery的error事件.statusText是"parseerror". 通过在stackoverflo ...
- 完整java开发中JDBC连接数据库代码和步骤
JDBC连接数据库 •创建一个以JDBC连接数据库的程序,包含7个步骤: 1.加载JDBC驱动程序: 在连接数据库之前,首先要加载想要连接的数据库的驱动到JVM(Java虚拟机), 这通过java.l ...
- C#中隐藏(new)、方法重写(override)、重载(overload)的区别
转自:http://www.cnblogs.com/glife/archive/2009/12/28/1633947.html 重载.重写和隐藏的定义: 重载:public string ToStri ...
- iOS 微信分享
1.注册微信开放平台账号:https://open.weixin.qq.com 2.创建应用 设置图片可以使用一个小工具,详情http://www.cnblogs.com/czq1989/p/5073 ...
- 折腾Ubuntu下的android studio
ps:网速很慢,耗时一天多.先吐槽一下搭建很麻烦,毕竟现在在ubuntu上用as的人还不太多,很多步骤最好先自备梯子. 测试环境: ubuntu 14.04 LTS 64bit 安装的东西无非就是an ...
- cocos2d-x iOS真机下载非根目录文件提示下载失败解决办法
在使用cocos api的Downloader或者AssetsManager下载文件到真机Document目录时,如果是直接下载到document根目录,是没问题的,如果是下载存放到了某个不存在的子目 ...