CSSと簡単なJSでできるドロワーメニューの実装方法｜notes by SHARESLはじめに WEBサイトでよくある実装ですが、スマホ表示の時にいわゆる「ハンバーガーボタン」などを作ってメニューを隠し、タップすると隠していたメニューを大きく開くような「ドロワーメニュー（Drawer Menu）」と呼ばれるメニュー。 スマホサイトでよく使われる手法ですね。今回はその実装方法をメモ。 実装内容 まず実際の画面はこちら。 ドロワーメニューのデモ 一応、スマホでもPCでも動くように作っています。 Githubにソースコードを置いてますのでコードを詳しく見たい方はどうぞ。 https://github.com/inos3910/drawer-menu HTML ヘッダーの中にハンバーガーボタンとメニューを用意します。 HTMLの書き方等に特に必須条件はないです。ボタンを置く位置もデザインによって様々なので自由に配置して大丈夫です。今回のデモではヘッダーの中にボタンとメニューを配置す
