クリックするとコンテンツを開くボタンを追加したので、コンテンツがすぐにポップアップします。しかし、コンテンツが優しく表示される滑らかな移行を追加したいと思います。これは私のコードです：ボタンをクリックしたときに開いているコンテンツをスムーズにやりとりする
<script type="text/javascript">
$(function() {
$('.toggle').click(function (event) {
event.preventDefault();
var target = $(this).attr('href');
$(target).toggleClass('hidden show');
});
});
</script>
何を追加する必要がありますか？
すべてのブロック（おそらく1つを除いて？）が閉じていると仮定すると、ターゲットブロックのcssにdisplay：noneを割り当てます（おそらく隠されたクラスがします）。
すでにjQueryのを使用しているので、最も簡単な方法は、あなたの代わりにあなたの現在のtoggleClassの探している効果に応じてslideToggle（）（http://api.jquery.com/slidetoggle/）またはfadeToggle（）（http://api.jquery.com/fadetoggle/）のいずれかを使用することです。
$(target).slideToggle();
CSSの移行ではこの問題は解決されていませんか？私は滑らかな、ユーザーからの変化のクラスへの移行のアニメーションの移行を考える。 – M98
単純にフェードインさせるというアイデアなら、CSSのトランジションで行うことができます。 jqueryソリューションはよりクロスブラウザーと互換性があり、高さ/可視性/不透明度の切り替えに切り替える必要はありません。 –
はい、私は彼がスムーズなアニメーションのようなことを尋ねてきました。クラス間の切り替えは簡単ではありません。 Jqueryのアニメーションも同様ですが、実際には何をするのかわからないので、CSS内の「トランジション」を使用することで、必要な効果を得ることができるというアイデアを提供することができます。 – M98
あなたのご意見ありがとうございます。実際、私はちょうど移行を探していたので、（私はより良い少ないJSを推測として）私はこれを使用して、CSSのために行くことにしました：あなたはあなたの隠された/ショークラスにトランジションを追加する必要が
#cb1 {position: absolute; left: -999em;}
label[for="cb1"] {cursor: pointer;}
#updates {max-height: 0; opacity: 0; overflow: hidden; transition: 1s ease-in-out;}
#cb1:checked~#updates {max-height: 100%; opacity: 1;}
。 '.show、.hidden {transition：0.5s ease-in-out} ' – M98