Dave's Brain

Browse - Programming Tips - How can I get the *rendered* size (width and height) of an element?

Date: 2014mar17
Language: javaScript
Library: jQuery

Q.  How can I get the *rendered* size (width and height) of an element?

A.  With jQuery use .width() and .height() like this:

function exampleUse() { var boxWidth = $('#mybox').width(); var boxHeight = $('#mybox').height(); console.log("box width x height is " + boxWidth + " x " + boxHeight); }
There is also:
var boxWidth = $('#mybox').css('width'); var boxHeight = $('#mybox').css('height');
Which gives a number followed by "px" - eg "100px" Generally, less useful.

Add a comment

Sign in to add a comment
Copyright © 2008-2017, dave - Code samples on Dave's Brain is licensed under the Creative Commons Attribution 2.5 License. However other material, including English text has all rights reserved.