I am trying to make my second div changes it height dynamically when my first div changes without changing the second div height in css just with jquery:
This is my fiddle: http://jsfiddle.net/692QF/
My html code:
<div id='box'>
<p>This is some text</p>
</div>
<div id='in'></div>
My css code:
#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 code:
$('#box').hover(function(){
$('#in').toggle();
$('#in').css({
'width' : '250px',
'height' : '60px',
'border' : '1px solid blue',
'padding' : '10px'
});
});
I created this fiddle for you hope this what you want actually I didn't understand your question very well
Fiddle: 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
});
});
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments