Currently, I am facing an issue with animating a div to a new height by summing up the heights of 3 other divs. Unfortunately, the heights do not seem to add up correctly, and I could really use some guidance on how to resolve this. Any suggestions or insights would be greatly appreciated. Thank you in advance!
var staff_CONTAINER_850_ht = $('#staff_CONTAINER_850').height();
var profile_850_BIO_ht = $('#profile_850_BIO').height();
var profile_850_EDU_ht = $('#profile_850_EDU').height();
var profile_850_CONTACT_ht = $('#profile_850_CONTACT').height();
var profile_TOTAL_ht = profile_850_BIO_ht + profile_850_EDU_ht +
profile_850_CONTACT_ht;
$("#launcher").click(function() {
$("#staff_CONTAINER_850").animate({
height: profile_TOTAL_ht
}, 300);
$("#staff_CONTAINER_850").animate({
marginTop: staff_CONTAINER_850_ht* -1
}, 300);
$("#profile_850_HEADER").animate({
marginTop: 45
}, 300);
$("#profile_850_BIO").delay(120).animate({
marginTop: 10
}, 450);
$("#profile_850_EDU").delay(220).animate({
marginTop: 10
}, 450);
$("#profile_850_CONTACT").delay(320).animate({
marginTop: 10
}, 450);
});