获取元素距离浏览区域的距离

网页被卷起来的高度/宽度（即浏览器滚动条滚动后隐藏的页面内容高度）

(javascript)        document.documentElement.scrollTop //firefox

(javascript)        document.documentElement.scrollLeft //firefox

(javascript)        document.body.scrollTop //IE

(javascript)        document.body.scrollLeft //IE

(jqurey)             $(window).scrollTop()

(jqurey)             $(window).scrollLeft()

网页工作区域的高度和宽度

(javascript)       document.documentElement.clientHeight// IE firefox

(jqurey)             $(window).height()

元素距离文档顶端和左边的偏移值

(javascript)        DOM元素对象.offsetTop //IE firefox

(javascript)        DOM元素对象.offsetLeft //IE firefox

(jqurey)             jq对象.offset().top

(jqurey)             jq对象.offset().left

获取页面元素距离浏览器工作区顶端的距离

页面元素距离浏览器工作区顶端的距离 = 元素距离文档顶端偏移值 - 网页被卷起来的高度

即：

页面元素距离浏览器工作区顶端的距离 = DOM元素对象.offsetTop - document.documentElement.scrollTop

时间： 2024-08-14 20:10:08

获取元素距离浏览区域的距离的相关文章

js获取元素宽高

只说ie8+的浏览器的方法. 在转vue之前,一直使用jquery来获取元素的高度,最近转vue,发现了一个问题.使用vue的时候,部分操作需要在mounted这个生命周期里面去做,官网对mounted的解释是: 如果不在vm.$nextTick里面做操作的时候,是很有可能获取不到组件内部元素的宽高的.刚开始的时候,我没有仔细看官网,所以在mounted里面是直接获取不到子孙元素的宽高的. 后来,看了iview的一个组件的源码,看到了getComputedStyle方法获取宽高,对getComp

JQuery 获取元素到浏览器可视窗口边缘的距离

获取元素到浏览器可视窗口边缘的距离 by:授客 QQ:1033553122 1.   测试环境 JQuery-3.2.1.min.js 下载地址: https://gitee.com/ishouke/front_end_plugin/blob/master/jquery-3.2.1.min.js Bootstrap-3.3.7-dist 下载地址: https://gitee.com/ishouke/front_end_plugin/blob/master/bootstrap-3.3.7.zip

获取两个坐标点的距离

/// <summary>         /// 获取两个坐标点的距离 /// </summary> /// <param name="lat1">坐标1的维度</param> /// <param name="lng1">坐标1的经度</param> /// <param name="lat2">坐标2的维度</param> /// <par

js获取页面的可是宽度，占位宽度，获取元素左上角相对页面左上角的位置，页面左上角相对可是区域的位置，元素是否存在于页面可视范围内

1 var css = (function () { 2 var doEle = document.documentElement, 3 doBody = document.body, 4 elementScrollLeft, 5 elementScrollTop, 6 utils, 7 offsetLeft, 8 offsetTop, 9 offsetParent; 10 11 utils = { 12 13 // 获取页面的可视宽度和高度 14 getAvailPage: function

获取经纬度之间两点间真实距离（适用于GoogleMap,BaiduMap,Amap等）

如何获取经纬度之间两点间真实距离(适用于GoogleMap,BaiduMap,Amap等) 目标:使用百度定位sdk开发实时移动距离计算功能,根据经纬度的定位,计算行驶公里数并实时刷新界面显示.大家都知道定位有三种方式:GPS .Wifi . 基站 .误差方面的话,使用GPS误差在10左右,Wifi则在20 - 300左右 ,而使用基站则误差在100 - 300左右的样子,因为在室内GPS是定位不到的,必须在室外,而我们项目的需求正好需要使用GPS定位,所以我们这里设置GPS优先.车,不可能在室

原生JS获取DOM 节点到浏览器顶部的距离或者左侧的距离

关于js获取dom 节点到浏览器顶/左部的距离,Jquery里面有封装好的offset().top/offset().left,只到父级的顶/左部距离position().top/position().left: 原生写的话就是用获取节点,do while循环就可以了.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta

获取元素样式对象 页面滚出 页面可是大小 添加监听事件 获取事件参数浏览器中位置 的兼容

/** * 获取浏览滚动出去的距离 * @returns {{scrollY: (Number|number), scrollX: (Number|number)}} */function scroll(){ return{ scrollY:window.scrollY||document.body.scrollTop||document.documentElement.scrollTop||0, scrollX:window.scrollX||document.body.scrollLeft|

【全面总结】js获取元素位置大小

目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) offsetWidth(只读) 2.滚动尺寸scroll scrollWidth(只读) scrollHeight(只读) scrollLeft(可写) scrollTop(可写) 3.关于client clientWidth(只读) clentHeight(只读) clientLeft(只读) clientTop(只读) 4.关于client

获取元素的left值

(1)jQuery中的:offset()方法 获取匹配元素在当前视口的相对偏移. 返回的对象包含两个整形属性:top 和 left.此方法只对可见元素有效. (2jQuey中的: position()方法 获取匹配元素相对父元素的偏移. 返回的对象包含两个整形属性:top 和 left.为精确计算结果,请在补白.边框和填充属性上使用像素单位.此方法只对可见元素有效. 也就是元素B距离元素A的距离. 在没有position()方法之前,计算B到A的距离 只有通过 先计算B距浏览器左边距 减去 A的