2022年7月15日SHAREツイートシェアはてブLINEPocketコピペ可能なハンバーガーメニューの閉開アニメーションを4つほどご紹介します。それぞれデモとサンプルコードを用意しました。クラスを付け替えることでアニメーションを実現しています。ハンバーガーメニューのボタンのアニメーションは「【CSS】ハンバーガーメニューのボタンアニメーション4選」に載せています。スライドイン(最初のデモと同じ)メニューが右からスライドインしてくるアニメーションです。translateX(0);}フェードインメニューがふわっと不透明になって表示されるアニメーションです。1;}くるっと回転しながら現れるメニューが左上から回転して現れるアニメーションです。rotateZ(0deg);}拡大しながら現れるメニューが大きくなりながら現れるアニメーションです。scale(1.0);}ハンバーガーメニューのボタンのアニメーションについてハンバーガーメニューのボタンアニメーションについてはこちらの記事で解説しています。