How to detect html div width and height once div is done resizing

- 1 answer

Ad

I am working with two divs where, one in the left is a collapsible container and the one in the right is a main container, something like this:

================================
|        |                     |
|        |                     |
|        |                     |
|  div 1 |         div 2       | 
|        |                     |
|        |                     | 
================================

I am collapsing div 1 using simple css class and when div 1 is not visible, div 2 expands in size and takes over rest of the space. Now I need to get the size of the div 2 once it is done with the resizing (which is not instant and it is using transition).

I want to render d3 stuff in div 2 and need to to know the correct dimension of the div. Unfortunately,

$("#div2-id").width()

is returning undefined result. I think it is mainly due to the transition. How can I get correct width and height of the div after resizing is done?

Ad

Answer

Ad

Read this post as I believe is a more accurate approach, as you fire an event as soon as the transition ends. Callback when CSS3 transition finishes

Ad
source: stackoverflow.com
Ad