CODEWITHSUNDEEP
jquerydomwidthreload
infinito
infinito

Reputation: 2075

Get width of element after resizing it

Is it possible to get the size of an element after resizing it using $(el).css()?

My code is:

function resize() {
    $(".combobox").css('width', '100%');
    var width = $(".combobox").width();
}

I've get the real value of the combobox only after calling the function a second time. The first time is gets the width before executing $(".combobox").css('width', '100%');

I suppose this is fault of the DOM not being recreated after the .css(). Is there any way to force DOM reloading?

Thanks in advance!

Upvotes: 0

Views: 4967

Answers (2)

rep_movsd
rep_movsd

Reputation: 6895

Try putting the part of the code that gets the width in a timer scheduled for 1 millisecond...

The browser won't do the resize calculation while the script is executing. If you schedule a timer and exit the JS function, the browser will update the state of all the DOM elements that changed, and then launch the timer, so by then the width of your combobox has updated.

I used something very similar in a GWT based webpage

This trick works not only for JS but in many GUI frameworks, which do layout in a delayed way.

Upvotes: 1

Makram Saleh
Makram Saleh

Reputation: 8701

Try chaining the two functions:

function resize() {
    var width = $(".combobox").css('width', '100%').width();
}

Upvotes: 0

Related Questions