0

So I have some logic that relies on JQuery's element.width() method. The logic is failing on me sometimes. I noticed that it is only failing when the element is hidden (inside a bootstrap collapsible element). I looked in the docs and they say:

The value reported by .width() is not guaranteed to be accurate when the element or its parent is hidden. To get an accurate value, ensure the element is visible before using .width(). jQuery will attempt to temporarily show and then re-hide an element in order to measure its dimensions, but this is unreliable and (even when accurate) can significantly impact page performance. This show-and-rehide measurement feature may be removed in a future version of jQuery.

So I know my problem. My plan is to check if the element is "hidden" and if so, instead of executing the logic right away, I will search for the collapsible parent and subscribe the logic to the shown.bs.collapse event.

My issue is how to check if the element is considered "hidden" by JQuery's width method (as mentioned in the docs). Is it as simple as:

element[0].style.display == "none"

I would like a check that captures all cases.

Thanks in advance.

pQuestions123
  • 4,053
  • 5
  • 24
  • 51

1 Answers1

0

I believe jQuery uses this logic:

$(element).is(":visible")
Mitch VanDuyn
  • 2,604
  • 1
  • 16
  • 27