1. getBoundingClientRect用于获取某个元素相对于视窗的位置集合。集合中有top, right, bottom, left等属性。

语法:这个方法没有参数

rectObject = object.getBoundingClientRect();

返回值类型:TextRectangle对象,每个矩形具有4个整数性质(上右下左)表示的坐标的矩形,以像素为单位。

 rectObject.top:元素上边到视窗上边的距离;

 rectObject.right:元素右边到视窗左边的距离;

 rectObject.bottom:元素下边到视窗上边的距离;

 rectObject.left:元素左边到视窗左边的距离;

搬运工:http://www.cnblogs.com/Songyc/p/4458570.html

获取某个元素相对于视窗的位置-getBoundingClientRect的更多相关文章

  1. 获取某个html元素相对于视窗的位置集合

    getBoundingClientRect() getBoundingClientRect()获取元素位置,这个方法没有参数 getBoundingClientRect()用于获得页面中某个元素的左, ...

  2. js获取html元素在可视区域的位置

    1)html节点在可视区域的位置 obj.getBoundingClientRect().top obj.getBoundingClientRect().left 2) 获取鼠标按下的位置 event ...

  3. vue 组件传递值以及获取DOM元素的位置信息

    1.父组件 select_li.vue 1.1 父组件模板 <template> <div id='selectLi' ref="selectLi"> &l ...

  4. 我的前端工具集(八)获得html元素在页面中的位置

    我的前端工具集(八)获得html元素在页面中的位置   liuyuhang原创,未经允许禁止转载 目录 我的前端工具集 有时候需要用点击等操作,来获取某元素在页面中的位置,然后在该位置添加某些操作 如 ...

  5. getBoundingClientRect() 来获取页面元素的位置

    getBoundingClientRect() 来获取页面元素的位置   document.documentElement.getBoundingClientRect 下面这是MSDN的解释: Syn ...

  6. 用getBoundingClientRect()来获取页面元素的位置

    以前绝大多数的使用下面的代码来获取页面元素的位置: [code="javascript"]var _x = 0, _y = 0;do{_x += el.offsetLeft;_y ...

  7. getBoundingClientRect获取元素在页面上的位置

    getBoundingClientRect用于获得页面中某个元素的左,上,右和下分别相对浏览器视窗的位置. getBoundingClientRect是DOM元素到浏览器可视范围的距离(不包含文档卷起 ...

  8. JQuery 获取页面某一元素在屏幕上的位置

    获取页面某一元素的绝对X,Y坐标 var X = $('#ElementID').offset().top;//元素在当前视窗距离顶部的位置 var Y = $('#ElementID').offse ...

  9. 用Javascript获取页面元素的位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

随机推荐

  1. 第7课 Thinkphp 5 模板输出变量使用函数 Thinkphp5商城第四季

    目录 1. 手册地址: 2. 如果前面输出的变量在后面定义的函数的第一个参数,则可以直接使用 3. 还可以支持多个函数过滤,多个函数之间用"|"分割即可,例如: 4. 变量输出使用 ...

  2. python爬虫基础10-selenium大全4/8-Webelement

    Selenium笔记(4)Webelement 本文集链接:https://www.jianshu.com/nb/25338984 这是通过find方法找到的页面元素,此对象提供了多种方法,让我们可以 ...

  3. python3爬取”理财大视野”中的股票,并分别写入txt、excel和mysql

    需求:爬取“理财大视野”网站的排名.代码.名称.市净率.市盈率等信息,并分别写入txt.excel和mysql 环境:python3.6.5 网站:http://www.dashiyetouzi.co ...

  4. Applied Nonparametric Statistics-lec10

    Ref:https://onlinecourses.science.psu.edu/stat464/print/book/export/html/14 估计CDF The Empirical CDF ...

  5. aoj-0118 property distribution(搜索)

    Time limit1000 ms Memory limit131072 kB タナカ氏が HW アールの果樹園を残して亡くなりました.果樹園は東西南北方向に H × Wの区画に分けられ.区画ごとにリ ...

  6. re--读书笔记【转】

    原文链接 * 正则表达式入门 1.正则表达式的两种基本用途:搜索和替换. 2.正则表达式是一些用来匹配和处理文本的字符串. 小结:正则表达式是文本处理方面功能最强大的工具之一,正则表达式语言用来构造正 ...

  7. centos7 bond 和 网桥配置

    rhel7系统bond配置(更新版本):https://www.cnblogs.com/zhangjianghua/p/9119808.html Bonding的模式一共有7种: 1.mode=0(b ...

  8. 【LVS】简介与说明

    一.IPVS的三种负载均衡技术 通过NAT实现虚拟服务器(VS/NAT) 客户通过Virtual IP Address(虚拟服务的IP地址)访问网络服务时,请求报文到达调度器,调度器根据连接调度算法从 ...

  9. PostgreSQL 全文索引

    -- 首先要创建自定义的词典,在不使用停用词文件的情况下创建自定义词典,例如: CREATE TEXT SEARCH DICTIONARY english_stem_nostop ( Template ...

  10. gdb调试手册 一 gdb概述

    一 gdb概述 gdb调试器的目的是让你了解其他的程序在执行的时候发生了什么或者其他程序崩溃时正在做什么 gdb主要能够在运行中做四类事情(包括这些事情中的一些附加的事情)来帮助你获取bugs a 运 ...