div调整大小后如何检测html div的宽度和高度 [英] How to detect html div width and height once div is done resizing

问题描述

我正在与两个div一起工作，其中，左边的一个是可折叠容器，右边的一个是主容器，就像这样:

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       | 
|        |                     |
|        |                     | 
================================

我正在使用简单的CSS类折叠div 1，并且当div 1不可见时，div 2会扩展大小并占据其余空间.现在，一旦完成调整大小后，我就需要获取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).

我想在div 2中渲染d3内容，并且需要知道div的正确尺寸.不幸的是

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

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

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

返回不确定的结果.我认为这主要是由于过渡.调整大小后如何获得正确的div宽度和高度?

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?

推荐答案

请阅读此文章，因为我认为这是一种更准确的方法，因为在转换结束后立即触发一个事件. CSS3转换完成时的回调

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

这篇关于div调整大小后如何检测html div的宽度和高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！