1

2 つの内部 div (上部と下部) を持つコンテナー div があります。上をクリックすると、その下の div が非表示に切り替わるはずです。同時に、コンテナーの高さを一定に保つために、下の div を非表示に切り替えたいと考えています。非表示に切り替えた div と非表示に切り替えた div の両方の div には同じ測定値がありますが、それでも効果はまったく滑らかではありません (最初に揺れているように見えます)。

これを回避する方法はありますか、または目的の結果を達成するために別の方法が必要ですか?

ところで:一部の要素に隠されたオーバーフローは、私が達成しようとしているものでは機能しません。

編集: 申し訳ありませんが、非常に単純なのでコードを投稿しませんでした。

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

JSFIDDLE

4

1 に答える 1

0

s と緑のもの ( ) に aposition:absolute;を追加します。次に、緑色の 1 つだけを動かし、赤色のスタティックフィドルをここに残します。divz-index:2;#subcvdiv

完全なコード

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;
}

jquery

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

あなたの問題は、divs が両方ともページ上に次々とあったため、上のものは下のものを下げたことでした1px（使用した場合、Toggleそれは `50px になります）。この部分がわかりにくかったらすいません。

于 2013-09-11T20:53:28.467 に答える