Usar height en un elemento invisible (hidden)

[seozeta]

Estoy creando un menú superior desplegable que tiene otro debajo que se queda fijado en la parte superior cuando se hace scrolldown. El problema es que el funcionamiento del menú fijado depende del alto que sea el menú desplegable de arriba. Cuando está plegado mide 34px, pero cuando está abierto puede variar el alto según los enlaces que contenga.

Cuando se carga la página, el menú óbviamente está plegado y HEIGHT me calcula los 34px automáticamente. Cuando lo despliego, hay otro elemento que se hace visible (.menuwrap), pero me sigue tomando los 34px porque son los que HEIGHT calculó al cargar la página, y en ese momento .menuwrap estaba invisible (hidden).

Os pongo mi código a ver qué podemos hacer:

Código Javascript:

$("document").ready(function($){
    if ($('#condensed-header').length){ //Si hay esta versión del menú
        var nav = $('#condensed-header');
        if ($('#topnav').length){ //Comprueba que tenga activada la navegación superior
            
            if ($(".mobile-top-button").is(":hidden")) { //Si no es versión responsive
                var height = 3 + $("#topnav .menuwrap").height();
            } else {
                
                //Si el menú no está desplegado
                if($("#topnav .menuwrap").is(":hidden")) { 
                    height = 3 + $(".mobile-top-button").height();
                } else {
                    height = 3 + $("#topnav").height(); //NO CALCULA ESTE HEIGHT
                }
            }           
            
        } else {
            height = 3;
        }
 
    $(window).scroll(function () {
            if ($(this).scrollTop() > height) {
                nav.addClass("f-nav");
            } else {
                nav.removeClass("f-nav");
            }
    });
    }
});