jQuery 协调切换

Question

我有一个包含 2 个内部 div(上层和下层)的容器 div。当我点击 upper 时，它应该切换以取消隐藏它下面的一个 div。同时我想切换隐藏较低的 div，以保持容器高度不变。两个 div - 我切换为隐藏的一个和一个要取消隐藏的 - 具有相同的措施，但效果仍然一点也不流畅(开始时似乎有晃动)。

有什么方法可以避免这种情况，或者我是否需要其他方法来达到我想要的结果？

顺便说一句:隐藏在某些元素上的溢出对我想要完成的事情不起作用。

编辑:抱歉，没有发布代码，因为它非常简单。

$("#ct").click(function () {
  $("#subcv").slideToggle("slow", "linear");
  $("#subph").slideToggle("slow", "linear");
});

JSFIDDLE

Answer 1

添加一个 position:absolute; 到 div 和 z-index:2; 到绿色的 (#子简历)。然后只移动绿色的一个，让红色的 div 保持静止 fiddle here .

完整代码

html

<button id="ct">Click here</button>
<div id="subcv"></div>
<div id="subph"></div>

CSS

#subcv, #subph {
    height: 50px;
    width: 100px;
    position:absolute;
}
#subcv {
    background-color: green;
    display:none;
    z-index:2;
}
#subph {
    background-color: red;
}

j查询

$("#ct").click(function () {
    $("#subcv").slideToggle("slow", "linear");
});

你的问题是 div 都在页面上，一个接一个，所以顶部的将底部的降低 1px(如果你只使用 Toggle 它将是 `50px)。对不起，如果这部分不清楚。