dom里面三种跟位置相关的元素

页面位置和大小，元素的位置和大小，鼠标位置

①window；位置（position）：(screenLeft, screenTop) 【(screenX, screenY不兼容IE)】

大小（size） ：（innerWidth,innerHeight），（outerWidht,outherHeight）

②element；位置（position）：（offsetLeft，offsetTop）

大小（size）：（clientWidth，clientHeight），（offsetWidth，offsetHeight）

③鼠标；位置坐标（position）：a)鼠标相对于视口：（clientX，clientY）

b)页面（pageX，pageY）

c)事件源（offsetX，offsetY）

d)屏幕（screenX，screenY）

dom 页面位置和大小，元素的位置和大小，鼠标位置的更多相关文章

  1. zedgraph控件怎么取得鼠标位置的坐标值（转帖）

    我想取得zedgraph控件上任意鼠标位置的坐标值,IsShowCursorValues可以显示鼠标位置的值但是不能提取赋值给其他的变量.用PointValueEvent这个事件又只能得到已经画出的点 ...

  2. 如何在CSS中映射的鼠标位置，并实现通过鼠标移动控制页面元素效果

    映射鼠标位置或实现拖拽效果,我们可以在 JavaScript 中做到这一点.但实际上,在CSS中有更加简洁的方法,我们可以在不使用JavaScript 的情况下,仍然可以实现相同的功能! 只使用CSS ...

  3. jquery获取元素在文档中的位置信息以及滚动条位置（转）

    jquery获取元素在文档中的位置信息以及滚动条位置 http://blog.csdn.net/qq_34095777/article/details/78750886     原文链接 原创 201 ...

  4. JS魔法堂：关于元素位置和鼠标位置的属性

    一.关于鼠标位置的属性   1. 触发鼠标事件的区域 盒子模型中的border,padding,content区域会触发鼠标事件,点击margin区域将不触发鼠标事件.   2. 鼠标事件对象Mous ...

  5. JQuery操作元素的属性与样式及位置 复制代码

    <script type="text/javascript" src="JQuery/jquery-1.5.1.js"></script> ...

  6. JQuery操作元素的属性与样式及位置

    <script type="text/javascript" src="JQuery/jquery-1.5.1.js"></script> ...

  7. 关于元素设置margin-top能够改变body位置的原因及解决（子元素设置margin-top改变父元素定位）

    关于元素设置margin-top能够改变body位置的原因及解决(子元素设置margin-top改变父元素定位) 起因:在进行bootstrap的.navbar-brand内文字设置垂直居中时采用li ...

  8. 获取元素在浏览器中的绝对位置（从jquery1.8中抠出来）

    <style> html,body{margin:0;padding:0;} .d1{margin-left:40px;background:red;width:2000px;height ...

  9. python删除指定位置 2个元素

    # -*- coding: utf-8 -*-__author__ = 'Administrator'import bisect#排序说明:http://en.wikipedia.org/wiki/i ...

随机推荐

  1. 刷题记录：[ASIS 2019]Unicorn shop

    目录 刷题记录:[ASIS 2019]Unicorn shop 一.涉及知识点 1.Unicode安全问题 刷题记录:[ASIS 2019]Unicorn shop 题目复现链接:https://bu ...

  2. #C++初学记录（树和二叉树）

    二叉树的编号 例题 6-6 小球下落问题 有一棵二叉树,最大深度为D,且所有叶子深度都相同.所有节点从上到下,从左到右编号为1,2,3,4,....,2^D-1.在节点1处放置小球,他会往下落.每个节 ...

  3. SSM项目实战 之 EasyUI

    目录 EasyUI 简介 概述 使用EasyUI panel组件 简介 示例 JS形式及属性介绍 panel事件与方法 Window组件 概述 使用 行为 dialog 概述 使用 tabs组件 概述 ...

  4. 【转】理解Docker容器网络之Linux Network Namespace

    原文:理解Docker容器网络之Linux Network Namespace 由于2016年年中调换工作的原因,对容器网络的研究中断过一段时间.随着当前项目对Kubernetes应用的深入,我感觉之 ...

  5. Spark2.x（五十六）：Queue's AM resource limit exceeded.

    背景: 按照业务需求将数据拆分为60份,启动60个application分别运行对每一份数据,application的提交脚本如下: #/bin/sh #LANG=zh_CN.utf8 #export ...

  6. Redis系列 | Redis5.0 新特性

  7. IDEA版本控制忽略文件或目录

    写在前面 废话不多说了, 新创建了个helloworld, 见图: 这谁受得了啊 修改配置 在上图红框内部的后面添加: *.iml;*.idea;*.gitignore;*.sh;*.classpat ...

  8. jsp页面获取后台传过来的list集合的长度

    在jsp页面导入函数标签库: <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"% ...

  9. String.format()详细用法

    String.format()字符串常规类型格式化的两种重载方式 format(String format, Object… args) 新字符串使用本地语言环境,制定字符串格式和参数生成格式化的新字 ...

  10. 钉钉服务端api接口使用

    原文链接:http://www.cnblogs.com/xiaosongJiang/p/9991573.html 第一步:注册钉钉企业账号 打开链接:https://oa.dingtalk.com/# ...