如何設置兩個div具有相同的高度在JQuery中

我試圖讓我的第二個div改變它的高度動態時不改變css的第二個div高度只是jquery我的第一個div變化：如何設置兩個div具有相同的高度在JQuery中

我html代碼：

<div id='box'> 
    <p>This is some text</p> 
</div> 
<div id='in'></div>

我css代碼：

#box{ 
background:#0066FF; 
border:1px solid blue; 
width:250px; 
position:absolute; 
top:10px; 
left:10px; 
padding:10px; 
} 
#in{ 
display:none; 
background:#000; 
position:absolute; 
z-index:-1; 
} 
p{ 
color:white; 
}

MY jquery代碼：

$('#box').hover(function(){ 
$('#in').toggle(); 
$('#in').css({ 
    'width' : '250px', 
    'height' : '60px', 
    'border' : '1px solid blue', 
    'padding' : '10px' 
}); 
});

來源

2014-07-13 Jim

我創造了這個搗鼓你希望這你真正想要的是我不明白你的問題非常好

小提琴：http://jsfiddle.net/692QF/1/

var height = $('#box').height(); 
var width = $('#box').width(); 
var border = $('#box').css('border'); 
var padding = $('#box').css('padding'); 

$('#box').hover(function(){ 
    $('#in').toggle(); 
    $('#in').css({ 
     'width' : width, 
     'height' : height, 
     'border' : border, 
     'padding' : padding 
    }); 
});

來源

2014-07-13 05:21:45

首先你需要得到第一個div的高度然後分配給第二個div 所以您的jQuery

$('#box').hover(function(){ 
    var hDiv1=$(this).height(); 
    $('#in').toggle(); 
    $('#in').height(hDiv1).css({ 
     'width' : '250px', 
     'border' : '1px solid blue', 
     'padding' : '10px' 
    }); 

});

DEMO

來源

2014-07-13 05:29:25

如何設置兩個div具有相同的高度在JQuery中

回答

相關問題