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. Unity之流光效果

    效果如图: shader如下: Shader "Unlit/Walk light" { Properties { _MainTex ("Base (RGB), Alpha ...

  2. PHP插入数据库代码，编辑，删除

    插入代码 $action=$_GET['action']; switch($action){ //添加记录 case"add"; $mail = trim(htmlspecialc ...

  3. Python- 解决PIP下载安装速度慢

    让PIP源使用国内镜像,提升下载速度和安装成功率. 国外的源下载速度太慢,而且经常出现下载后安装出错问题.把PIP安装源替换成国内镜像,可以大幅提升下载速度,还可以提高安装成功率. 国内源: 新版ub ...

  4. 教你如何在win7中安装cygwin64

    首先,说说我们为什么要安装cygwin吧,长期在win7下开发的人员可能不习惯使用unix系统,但由于工作问题,你又被逼要在unix环境下开发,那该如何是好啊?但现在你不用再纠结了,因为有cygwin ...

  5. 记录:工作中用到的Js日期时间方法

    /** * 获取当前时间 */ function getDate() { return new Date(); } /** * 格式化当前时间 * @param {*} value */ functi ...

  6. PHP防止网页快速刷新+代理ip访问

    前几天网站收到了一些CC攻击,比较郁闷...这里分享一下,防止网页自动刷新的方法以及阻止代理IP访问网站的方法,代码是分开的,两个功能,需要那个用那个,可以自定义时间间隔,这个代码不止可以防CC攻击, ...

  7. P2365 任务安排 / [FJOI2019]batch（斜率优化dp）

    P2365 任务安排 batch:$n<=10000$ 斜率优化入门题 $n^{3}$的dp轻松写出 但是枚举这个分成多少段很不方便 我们利用费用提前的思想,提前把这个烦人的$S$在后面的贡献先 ...

  8. 【Python64-tkinter_label组件】

    一.label组件用于在屏幕上显示文本活图像,Label组件仅能显示单一字体的文本,单文本可以跨越多行.另外还可以为其中的个别字符加上下划线 二.如何使用label组件 使用label组件,你可以指定 ...

  9. RabbitMQ&RocketMQ动态添加Queue参考

    Kafka重复消费与消息丢失参考: https://www.cnblogs.com/kaleidoscope/p/9763053.html https://blog.csdn.net/qingqing ...

  10. [js] - 前端FileReader使用,适用于文件上传预览.(并未传入后端)

    <body> <div class="box"> <div class="container"> <ul> &l ...