第一次如何獲得正確的div innerHeight？

我有一個隱藏的子導航高度設置爲0.該div的內部是子導航的幾個部分。第一次如何獲得正確的div innerHeight？

我得到被點擊的部分的名稱，然後得到該div的innerHeight。然後使用該高度，我將從0到該值的.sub_navigation高度設置爲動畫。但是，由於某種原因，第一次點擊（獲取值）時，它會關閉，太高，第二次完美。

你會如何解決這個問題？

角（從jQuery的轉換）

// Controller for Nav 
app.controller('NavController', function(){ 
    // Property of Controller 

    this.clicked = function(menuItem) { 
     console.log(menuItem); 

     var contentHeight = $('.'+menuItem+'-content').innerHeight(); 
     var content_height = $('.'+menuItem+'-content').innerHeight(); 

     $('.sub_navigation').css({'height' : '0px'}); 
     $('.'+menuItem+'-content').siblings().css({'display' : 'none'}); 
     $('.'+menuItem+'-content').css({'display':'block', 'height':'auto'}); 
     $('.sub_navigation').animate({ 
      height: contentHeight 
     }); 

     console.log('content_height = '+content_height); 
     console.log(contentHeight); 
    }; 
});

的jQuery

$(document).delegate(".navigation-links a", "click", function(){ 
    var myContent = $(this).attr("data-content"); 
    var contentHeight = $("."+myContent+"-content").innerHeight(); 

    $("."+myContent+"-content").siblings().css({"display":"none"}); 
    $("."+myContent+"-content").css({"display":"block", "height":"auto"}); 
    $(".subNavigation").animate({ 
     height: contentHeight 
    }); 
});

如果你點擊增長，第一時間高度爲400，第二次是266 :(

來源

2014-09-25 Leon Gaban

The in nerHeight documentation說：

通過.innerHeight()報告的價值是不能保證準確當元素的父是隱藏的。要獲得準確的值，您應在使用.innerHeight()之前先顯示父母。

所以，儘管父母是可見的，也許元素本身不可見的事實使高度值不準確。

您是否嘗試過更改訂單？

//Make the sub menu visible first 
$('.'+menuItem+'-content').siblings().css({'display' : 'none'}); 
$('.'+menuItem+'-content').css({'display':'block', 'height':'auto'}); 

var contentHeight = $('.'+menuItem+'-content').innerHeight(); 
var content_height = $('.'+menuItem+'-content').innerHeight(); 

$('.sub_navigation').css({'height' : '0px'}); 
....

來源

2014-09-25 18:13:58

甜啊，就是這樣！：）謝謝 – 2014-09-25 18:39:46

試圖表明該菜單項同時獲得高度：

this.clicked = function(menuItem) { 
    var menu = $('.'+menuItem+'-content'); 
    menu.show(); 
    var contentHeight = menu.outerHeight(); 
    menu.hide(); 
    ...

來源

2014-09-25 18:26:18

第一次如何獲得正確的div innerHeight？

回答

相關問題