こんにちは、daimaです。 本日は私も業務でよく使っている おしゃれでコンパクトな ハンバーガーメニューのサンプルコードを コピペしてすぐに使える形でご紹介したいと思います。 最終更新2021/01/30 : ・ナビ部分の開閉の仕組みを調整(画像など張り付けた時にずれて移動してしまっていたのを修正) ・ナビの中身のheightがナビのheightを超えた場合にスクロールが効くように修正 レスポンシブ対応のハンバーガーメニューをコピペで簡単に設置したい ハンバーガーボタンはスクロールしてもずっとついてきて欲しい ナビが開いているときにナビ以外の部分をクリックしたらナビを閉じてほしい ナビが出現するときは画面端からスムーズに出現してほしい 細かいデザインや動きは自分で調整したい 最新の主要ブラウザ(Chrome、EDGE(IE)、Firefox、safari)に対応していてほしい このような
![コピペで5分!右から出てくるおしゃれなハンバーガーメニューの作り方【レスポンシブ対応】](https://cdn-ak-scissors.b.st-hatena.com/image/square/021143af02acc7cfc434b1b9870e4446d128d79e/height=288;version=1;width=512/https%3A%2F%2Fspreadsheep.net%2Fwp-content%2Fuploads%2F2017%2F10%2Fhumburgur-smn.jpg)