CODEWITHSUNDEEP
javascripthtml
sigEleven
sigEleven

Reputation: 63

Programmatically determine the height of a div element

I'm trying to get the height of a div, then position it based on the height. I've read various articles on this, but I always seem to be getting NaN as a result. Yes the javascript is loaded at the end of the body, after the divs are drawn.

I'm using asp.net to create this javascript dynamically. What I have output so far is:

var resultsDiv = document.getElementById('resultsDiv');
var resultsInnerDiv = document.getElementById('resultsInnerDiv');
resultsInnerDiv.innerHTML = "test";
var h = parseInt(resultsInnerDiv.style.offsetHeight);
alert(parseInt(resultsInnerDiv.style.offsetHeight));
resultsInnerDiv.style.top = ((h / 2) -125) + 'px';

I need to get the actual height, instead of NaN. NaN pixels is obviously not valid.

Upvotes: 2

Views: 1296

Answers (2)

ATOzTOA
ATOzTOA

Reputation: 35960

Try this:

var resultsDiv = document.getElementById('resultsDiv');
var resultsInnerDiv = document.getElementById('resultsInnerDiv');

resultsInnerDiv.innerHTML = "test";

var h = parseInt(resultsInnerDiv.offsetHeight);

alert(h);

resultsInnerDiv.style.top = ((h / 2) -125) + 'px';

Upvotes: 0

Behrang Saeedzadeh
Behrang Saeedzadeh

Reputation: 47933

I think this what you need:

var resultsDiv = document.getElementById('resultsDiv');
var resultsInnerDiv = document.getElementById('resultsInnerDiv');
resultsInnerDiv.innerHTML = "test";
var h = parseInt(resultsInnerDiv.offsetHeight);
alert(parseInt(resultsInnerDiv.offsetHeight));
resultsInnerDiv.style.top = ((h / 2) -125) + 'px';

offsetHeight is not a property of element.style, but the element itself (see here).

Upvotes: 3

Related Questions