Bug Tracker

Opened 6 years ago

Closed 6 years ago

#14685 closed bug (notabug)

.height() inconsistencies with hidden elements

Reported by: ult_combo Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: 1.10.2
Keywords: Cc:
Blocked by: Blocking:

Description

I'm aware that upon trying to retrieve the .height() of an element, jQuery currently swaps display:none by display:block (source), but it also adds position:absolute as part of the cssShow object, which takes the element out of the normal document flow and thus no longer respect the original line-breaking rules.

This makes a difference when the element's height varies depending on the automatic line-breaking.

See this fiddle with 3 identical elements, where .height() returns a different value for each one.

So, .height() "works" on hidden elements but the returned value is sometimes inconsistent with the height that would be obtained if the given element was being shown (display:block) inside the normal document flow.

Another inconsistency is that even though .height() works on elements with display:none, it will fail when an ancestor of the element has display:none, as the previously linked cssShow $.swap is only applied to the element being measured.


Changing that cssShow $.swap by a .show(), measure, .hide() would be more accurate in my opinion (keeping element in the document flow).

I'm not sure about elements with hidden ancestors. Any change here could cause back-compat issues, maybe add an optional "makeSureElementIsVisible" parameter to recursively display hidden ancestors in the .height()/.width() getter functions.


tl;dr:

  • .height() screws line breaking due to absolute positioning and is thus inconsistent on hidden elements;
  • .height() works on hidden elements (display:none) but does not work on elements with a hidden ancestor.

I believe this behavior is rather confusing, thus reporting as a bug.

Note: I believe all this also applies to .width() as well, since they share the same getter hook.

Change History (3)

comment:1 Changed 6 years ago by dmethvin

Asking for the height or width of something that isn't currently visible is dicey. The trick of swapping out the display property seemed really boss at the time but in retrospect was a mistake. So I'd prefer we just document that getting dimensions of hidden elements can be flakey and leave it at that.

comment:2 Changed 6 years ago by ult_combo

@dmethvin I agree, updating docs is a viable option too.

comment:3 Changed 6 years ago by dmethvin

Resolution: notabug
Status: newclosed
Note: See TracTickets for help on using tickets.