jquery - 折りたたみと展開に関する DIV の問題

Question

コードを変更しようとしましたが、何らかの理由で期待どおりに動作しません。DIVを真ん中に置きたいのですが、折りたたみ/展開中にスムーズに上下にスライドさせたいです。[表示/非表示] をクリックすると、ページが移動し、その理由がわかりません。

Answer 1

シフトは見られませんが、中央に配置するには (#sd ルール) 幅 (95% 以外 - 550px などの画像の幅に近いもの) を指定し、余白を に設定しmargin:0 autoます。align:centerまた、ルールを取り除きます。

#sd {
    width: 550px;
    margin: 0 auto;
}

Answer 2

シフトは、Web ページの高さに基づいてスクロールバーが表示または非表示になった結果です。スクロールバーを保持できるので、シフトは発生しません

html {
       overflow-y: scroll;
}

Answer 3

お知らせが展開されると垂直スクロール バーが表示され、ページ コンテンツが 18 ピクセル (通常) 左に移動するため、ページが移動します。これを克服するにはいくつかの方法があります。迅速で汚い修正は、アナウンスが展開されたときにページの最小高さを高さに設定することです。またはoverflow-y:scroll、本体に設定するだけで同じ結果を得ることができます原因がわかれば、特定の要件に適した解決策が見つかると確信しています。