CODEWITHSUNDEEP
javascriptdomside-effectsoffsetheight
Andy
Andy

Reputation: 8652

Does getting the offsetHeight of an element have a side effect?

In the code for Bootstrap collapse, in the hide() method, I see the following line:

this.$element[dimension](this.$element[dimension]())[0].offsetHeight

I don't understand what the point of the .offsetHeight at the end is unless it has a side effect, because it's not being assigned to anything. Does it have a side effect?

Upvotes: 3

Views: 396

Answers (2)

Santiago Hernández
Santiago Hernández

Reputation: 5636

here is a useful comment from bootstrap team:

if (doAnimate) this.$backdrop[0].offsetWidth // force reflow

Upvotes: 2

Benjamin Gruenbaum
Benjamin Gruenbaum

Reputation: 276306

Some old browsers like old versions of IE had the problem of sometimes not reflowing (re-rendering the presentation) after you performed some actions.

Mearly querying some properties like offsetHeight forces the DOM to recalculate and redraw the objects on the screen.

So, the side effect is forcing a reflow (redraw) of the screen. Quirky, but an old trick for old browsers.

Here is a question where this is suggested as a solution for an old version of Google Chrome where it did not work properly without it.

Upvotes: 6

Related Questions