1）html节点在可视区域的位置

obj.getBoundingClientRect().top

obj.getBoundingClientRect().left

2) 获取鼠标按下的位置

event.clientX

event.clientY

3) html节点在父元素里的位置

obj.offsetTop

obj.offsetLeft

obj.offsetHeight   元素的高度

obj.offsetWidth    元素的宽度

js获取html元素在可视区域的位置的更多相关文章

  1. ScrollReveal.js 用于创建和管理元素进入可视区域时的动画效果，帮助你的网站增加吸引力。

    ScrollReveal.js 用于创建和管理元素进入可视区域时的动画效果,帮助你的网站增加吸引力. 1.http://www.yangqq.com/jstt/css3/2017-08-08/787. ...

  2. javascript js获取html元素各种距离方法

    //滚动条 scrollLeft//滚动条距左边距离 scrollTop//滚动条距顶部距离 scrollWidth//滚动条元素的宽 scrollHeight//滚动条元素的高 //可视范围 cli ...

  3. js获取隐藏元素宽高的方法

    网上有一些js获取隐藏元素宽高的方法,但是可能会存在某些情况获取不了. 例如: <!DOCTYPE html> <html lang="en"> <h ...

  4. JS1 js获取dom元素方法

     js获取dom元素方法  1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId")         其 ...

  5. 使用js获取伪元素的content

    在测试过程中有时候会遇到反爬虫机制,一些元素会使用伪元素,这样在定位元素的时候会定位不到,这时候就要使用js来帮助定位,获取到想要的元素 下面是部分代码 //使用js获取伪元素的content Str ...

  6. 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题

    1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...

  7. JS获取DOM元素的八种方法

    JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...

  8. 获取某个元素相对于视窗的位置-getBoundingClientRect

    1. getBoundingClientRect用于获取某个元素相对于视窗的位置集合.集合中有top, right, bottom, left等属性. 语法:这个方法没有参数 rectObject = ...

  9. JS获取页面,元素,窗口和返回页面,元素,窗口的宽高以及滚动值

    jquery获取页面,元素,窗口的宽高以及滚动值 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window) ...

随机推荐

  1. Python基础(八) yaml在python中的使用

    yaml 通常用来存储数据,类似于json YAML 简介 YAML(Yet Another Markup Language),一种直观的能够被电脑识别的数据序列化格式,是一个可读性高并且容易被人类阅 ...

  2. IdentityServer4授权和认证集成Identity和profile

    identiyt的使用可以看之前的文章:https://www.cnblogs.com/nsky/p/10323415.html 之前的ids4授权服务器都是用的in-men方式把数据添加到内存, 现 ...

  3. vue 之iview

    iView-admin2.0:https://admin.iviewui.com/ 组件:https://www.iviewui.com/docs/guide/install

  4. 如何消除img默认的间距

    方案一:div{font-size:0};方案二:img{ display:block};方案三:img{vertical-align:top;}方案四:div{ margin-bottom:-3px ...

  5. jw player 配置参数

    Loading the player … //player所在div //具体配置参数 jwplayer(“container”).setup({//通过js调用播放器并安装到指定容器(contain ...

  6. Docker Registry V2 with Nginx

    安装 nginx 修改/etc/yum.repos.d/nginx.repo [nginx] name=nginx repo baseurl=http://nginx.org/packages/cen ...

  7. 第八节 JS运动基础

    运动基础 让Div运动起来 速度——物体运动的快慢 运动中的Bug 不会停止 速度取某些值会无法停止 到达位置后再点击还会运动 重复点击速度加快 匀速运动(速度不变) 运动框架及应用: 运动框架: 在 ...

  8. oracle(3)

    存储过程: CREATE OR REPLACE PROCEDURE PROC_ABC ( currency IN NUMBER, aysdate IN DATE, money OUT number ) ...

  9. Docker Swarm java 服务集群

    Docker Swarm java 服务集群 环境1: 系统:Linux Centos 7.4 x64 内核:Linux docker 3.10.0-693.2.2.el7.x86_64 Docker ...

  10. Codeforces 333E Summer Earnings - bitset

    题目传送门 传送门I 传送门II 传送门III 题目大意 给定平面上的$n$个点,以三个不同点为圆心画圆,使得圆两两没有公共部分(相切不算),问最大的半径. 显然答案是三点间任意两点之间的距离的最小值 ...