得到一個div的高度，基於其他div的高度

這裏有一個簡單的HTML樣本：得到一個div的高度，基於其他div的高度

<div id="column-5" style="height:300px;width:200px;background:red"> 
<div class="httwitter-thread-navigation" style="height:223px;width:100%;background:pink"> 
    <div class="mydiv" style="width:auto;background:yellow;"></div> 
</div>

我想要實現的是給予高度.mydiv基於以下操作： .mydiv的高度應爲「＃列5的高度」 - 「.httwitter線程導航的高度 - 40像素」

它轉換在這種情況下

300 - 223 - 40 = 37px

我如何獲得與JavaScript的37px高度？

認爲柱5或另一個的高度可能無法在CSS中指定，這樣的JavaScript應該檢測到它的innerHeights（包括利潤和填充）

太感謝你了

小提琴在這裏：http://jsfiddle.net/omegaiori/hafn5/1/

來源

2014-01-07 valerio0999

.mydiv的高度應爲「＃列5的高度」 - 「.httwitter線程導航的高度 - 40像素」

幾乎總結了它？

$('.mydiv').height(function() { 
    return $('#column-5').height() - $('.httwitter-thread-navigation').height() - 40; 
});

FIDDLE

jQuery有兩個outerHeight和innerHeight爲好，這取決於你所需要的。閱讀文檔。

來源

2014-01-07 16:46:40 adeneo

這是正確的右擊？ http://jsfiddle.net/omegaiori/hafn5/3/ – valerio0999

@omegaiori - 如果innerHeight是你所追求的，是的。你的小提琴和答案中的一個將高度設置爲37px – adeneo

在這裏你去：

$(document).ready(function() { 

    $('.mydiv').css('height', ($('#column-5').height() - $('.httwitter-thread-navigation').height() - 40); 

});

來源

2014-01-07 16:50:36

得到一個div的高度，基於其他div的高度

回答

相關問題