调整浏览器大小时jquery div innerheight不更新

Question

i made jQuery which give me max height of contentarea div and apply it "wrapper" div and mobile view 100% height, but problem is, not problem is no getting height dynamically(Live update when resize browser size) here is code and jsfiddle link https://jsfiddle.net/st0evt1n/1/

setmenuheight();
$(window).bind("load resize", function() {

    var menuheight = $( window ).width();
        if(menuheight <= 768){
            $(".wrapper").css('height','100%');
            $(".contentarea").css('height','100%');  
        } else {
            setmenuheight();
        }
    });

function setmenuheight() {
    var TabgetHeight = 1;
    $(".tabulmain > li").each(function() {
        var forHeight = $(this).find(".contentarea").innerHeight();
        TabgetHeight = forHeight > TabgetHeight ? forHeight : TabgetHeight;
        $(this).find(".contentarea").css('height',forHeight);
    });
    $(".wrapper").css('height',TabgetHeight+15);      
}

Answer 1

You can try this one:

.contentarea{ opacity:0; visibility:hidden;}
.tabulmain > li:hover .contentarea{ opacity:1; visibility:visible;}

.mainnavtag ul li
{
  height:20px;

}
.mainnavtag ul li:hover { opacity:1; visibility:visible;height:auto;}

DEMO HERE

Answer 2

I think problem, because you have error in your code. You get .width() of element and treat it like a height