当前位置:网站首页>Get the exact offset of the element
Get the exact offset of the element
2022-07-07 22:21:00 【Belden wind】
adopt getBoundingClientRect obtain ( recommend )
const getOffset = (element: HTMLElement) => {
const elemRect = element.getBoundingClientRect();
const offsetY = elemRect.top + window.scrollY;
const offsetX = elemRect.left + window.scrollX;
return {
left: offsetX,
top: offsetY,
};
};
adopt offsetParent obtain ,( If the element has translate(xx,xx), It will fail
const getOffset = (
element: HTMLElement,
type: 'offsetTop' | 'offsetLeft'
): number => {
let actualOffset = element[type];
let current = element.offsetParent as HTMLElement;
while (current !== null) {
actualOffset += current[type];
current = current.offsetParent as HTMLElement;
}
return actualOffset;
};
边栏推荐
- npm uninstall和rm直接删除的区别
- Node:504 error reporting
- Jerry's configuration of TWS cross pairing [article]
- 强化学习-学习笔记9 | Multi-Step-TD-Target
- The maximum number of meetings you can attend [greedy + priority queue]
- #DAYU200体验官#MPPT光伏发电项目 DAYU200、Hi3861、华为云IotDA
- Debugging and handling the problem of jamming for about 30s during SSH login
- 建立自己的网站(18)
- Attitude estimation (complementary filtering)
- OpenGL job - texture
猜你喜欢
null == undefined
Build your own website (18)
大数据开源项目,一站式全自动化全生命周期运维管家ChengYing(承影)走向何方?
NVR硬盘录像机通过国标GB28181协议接入EasyCVR,设备通道信息不显示是什么原因?
What if the win11u disk does not display? Solution to failure of win11 plug-in USB flash disk
为什么Win11不能显示秒数?Win11时间不显示秒怎么解决?
Preparing for the interview and sharing experience
How to choose the appropriate automated testing tools?
Ternary expressions, generative expressions, anonymous functions
cv2.resize函数报错:error: (-215:Assertion failed) func != 0 in function ‘cv::hal::resize‘
随机推荐
Vs custom template - take the custom class template as an example
【Azure微服务 Service Fabric 】如何转移Service Fabric集群中的种子节点(Seed Node)
Time standard library
Customer case | China law network, through observing the cloud, greatly shortens the time of fault location
OpenGL jobs - shaders
Jerry's power on automatic pairing [chapter]
OpenGL configure assimp
大数据开源项目,一站式全自动化全生命周期运维管家ChengYing(承影)走向何方?
Index summary (assault version)
反爬通杀神器
Cv2.resize function reports an error: error: (-215:assertion failed) func= 0 in function ‘cv::hal::resize‘
Reinforcement learning - learning notes 9 | multi step TD target
npm uninstall和rm直接删除的区别
Matplotlib drawing interface settings
The strongest installation of the twin tower model, Google is playing "antique" again?
The cyberspace office announced the measures for data exit security assessment, which will come into force on September 1
ByteDance senior engineer interview, easy to get started, fluent
How to write an augmented matrix into TXT file
#DAYU200体验官#MPPT光伏发电项目 DAYU200、Hi3861、华为云IotDA
【JDBC Part 1】概述、获取连接、CRUD