本页http://orad.msbitsoftware.com/尝试垂直对齐登录表单。当我尝试通过 JavaScript 获得它的顶部位置时,我得到了错误的结果,这与 chrome 开发人员工具得到的结果相同(见附件截图)。
谁能解释一下导致这个问题的原因?为什么浏览器的原生工具也会受到影响?有没有办法通过 JavaScript 获取元素的正确位置?
谢谢。
最佳答案
这是一种将高度未知的元素垂直居中的常用方法。
顶部位置设置为50%,使元素的顶部位于父元素的中心(这个50%与父元素的高度有关)
并且元素以 50% 的垂直平移进行转换。这与元素高度有关,并使元素垂直移动,直到它的中心位于父元素的中心
top: 50%;
transform: translateY(-50%);
您获得的最高值在转换之前。这是正确的行为,但在视觉上您会看到转换后的元素。
更好的解释 here查看 -> vertically -> block level -> unknown height 部分
关于javascript - 如何获得垂直对齐元素的正确顶部位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30798238/