根据另一个Div内容及其高度增加Div高度

S R*_*han 1 javascript jquery

当前的小提琴示例

我有两个Div .mainDiv.sideDiv. .mainDiv有很长的内容,其中包含切换段落.单击" 单击以展开文本"时,将显示FULL段,并且此内容的高度会增加.

我想要什么:当我按下单击以展开文本时,.mainDiv高度增加,并且.sideDiv高度应该增加等于.mainDiv高度.当主DIV 再次降低.sideDiv的高度时也会减少.

有没有办法让jQuery实现这一目标?我不擅长jquery所以我发现如果有人帮助我,很难实现它对我来说会很好.并且对不好的英语也很抱歉

谢谢

HTML

<div class="mainDiv">
<p class="click"> Click to expand </p>

<p class="hide">
    and scrambled it to make a type specimen book. It has survived not only five centuries, 
    but also the leap into electronic typesetting, remaining essentially unchanged. 
    It was popularised in the 1960s with the release of Letraset
    sheets containing Lorem Ipsum passages, and more recently with
    desktop publishing software like Aldus PageMaker 
    including versions of Lorem Ipsum.

</p>    

</div>

<div class="sideDiv">
  <p>Should Expand this Div</p>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS

.mainDiv {
background-color:#ccc;
float:left;
width:200px;
}

.sideDiv {
background:yellow;
float:left;
width:200px;
height:auto;
}
Run Code Online (Sandbox Code Playgroud)

JavaScript的

$('.hide').hide();

$('.click').on('click', function () {
$('.hide').toggle();
});
Run Code Online (Sandbox Code Playgroud)

kbv*_*hnu 5

是的,请试试这个.

演示:http://jsfiddle.net/M35xJ/5/

$('.click').on('click', function () {
    $('.hide').toggle();        
    $('.sideDiv').height($('.mainDiv').height());
});
Run Code Online (Sandbox Code Playgroud)

更多细节:http://api.jquery.com/height/