jQuery 获取隐藏元素的偏移量

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5974323/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 20:08:14  来源:igfitidea点击:

Get the offset of a hidden element

jqueryhiddenoffset

提问by Simon

How can I get the coordinates of a hidden element? offset()doesn't support the use for hidden elements. Any hints?

如何获取隐藏元素的坐标?offset()不支持使用隐藏元素。任何提示?

回答by issa marie tseng

If your element has had .hide()called on it, or if it's got display:nonein css, the browser doesn't bother rendering it at all. In this case, the answer is not directly. In recent jQueries, you can't even get its width or height.

如果您的元素已经.hide()调用它,或者它display:none在 css 中,浏览器根本不会费心渲染它。在这种情况下,答案不是直接的。在最近的 jQueries 中,您甚至无法获得其宽度或高度。

On the other hand, if you .show()an element, then .hide()it before an execution loop (an event firing through to when there's no more code to run for that event), the browser will be forced to relayout the page and you'll be able to get its offset between when it's shown and hidden, but it won't be forced to repaint, so your users won't see a blip, and you won't lose as much performance as you might think.

另一方面,如果你.show()是一个元素,那么.hide()它在执行循环之前(一个事件触发到没有更多代码可以运行该事件),浏览器将被迫重新布局页面,你将能够在显示和隐藏之间获得它的偏移量,但它不会被迫重新绘制,因此您的用户不会看到光点,并且您不会像您想象的那样失去性能。

回答by c-smile

You can get coordinates of visibility:hiddenelement but display:noneelement is excluded from rendering tree. So its position is undefined.

您可以获得visibility:hidden元素的坐标,但display:none元素被排除在渲染树之外。所以它的位置是不确定的。

回答by Janne

Other than quick show & do-stuff & hide -procedure, it might be possible to simply use loading mask to pretend that screen (or part of it) is invisible.

除了快速显示 & 做东西 & 隐藏 - 过程之外,还可以简单地使用加载掩码来假装屏幕(或其中的一部分)是不可见的。

This occurred when I was working on map which had hidden elements. I needed to get css-positions / offsets read without displaying those elements. I came up with three possible methods to use:

这发生在我处理具有隐藏元素的地图时。我需要在不显示这些元素的情况下读取 css-positions / offsets。我想出了三种可能的方法来使用:

  • load mask over map for the time being, so that map doesn't display hidden elements, and read offsets (problem: overlay hides parent element (map) too). This works best if there is no parent-element which requires displaying.

  • change z-index of elements which are hidden, so that they go behind parent element, show & and read values, hide 'em and change z-index to original.

  • use separate data-variables for CSS-styles, so that they are part of element. This works nice if elements have fixed/absolute positions against window or certain element, since css-positions / offsets won't change according to size of window/element. This worked well in my case, since I was working with elements absolute against window (fullscreen/-window application).

  • 暂时在地图上加载掩码,以便地图不显示隐藏元素,并读取偏移量(问题:叠加也隐藏了父元素(地图))。如果没有需要显示的父元素,这效果最好。

  • 更改隐藏元素的 z-index,以便它们位于父元素后面,显示 & 和读取值,隐藏它们并将 z-index 更改为原始值。

  • 为 CSS 样式使用单独的数据变量,以便它们成为元素的一部分。如果元素具有相对于窗口或某些元素的固定/绝对位置,这会很好用,因为 css-positions/offsets 不会根据窗口/元素的大小而改变。这在我的情况下效果很好,因为我正在使用针对窗口的绝对元素(全屏/窗口应用程序)。

Other methods suggested by users work too, but it all depends on what you are working on.

用户建议的其他方法也有效,但这完全取决于您在做什么。