问题
I'm trying to get the width of an element which will be shown in a jquery-ui dialog.
The dialog is set to display:none on load. This is not allowing me to get the width.
Do I need to show it, get the width and hide it again immediately to get the width? Or is there some other option I'm not aware of?
Thanks
回答1:
You have two options:
- If your jquery-ui dialog must be
display:none, the only way to get dimensions of its child is show/get_dimensions/hide. - If you can set it to
visibility:hidden, then there is nothing to do: just get the dimensions.
However, setting a jquery-ui container to visibility:hidden is not a good thing as it could modify the whole behaviour of the system. There is maybe a test for display:none somewhere in the jquery-ui-dialog script, and modifying it using visibility would break this test. Additionally, if there isn't, nothing ensures that there won't be any in the future versions of jquery-ui.
To quickly get the dimensions with the first solution, please refer to this answer.
The Mootools-more Element.measure solution:
Mootools implement the show/measure/hide technique in Mootools-more's Element.measure. The raw code wouldn't work with jQuery as Mootools directly extends elements instead of giving a framework wrapper, but you can easily adapt it for your purpose.
来源：https://stackoverflow.com/questions/10967857/get-the-size-of-an-element-when-inside-a-displaynone-parent