今回は以下のようなレスポンシブメニューを実装しました。 ・モバイル時に、メニューをフルスクリーンで表示 ・メニュー開閉アニメーションはフェードイン/フェードアウト ・jQueryのfadeToggleなどは使わずに、classの付け外しをjQueryで行う デモはこちらです。 yuri memo - レスポンシブメニュー DEMO デモは、以下のような構成になっています。 HTML [ fade_menu.html ] CSS [ css/style.css ] jQuery [ js/jquery-2.0.0.min.js ] [ js/script.js ] HTML 順番にコードを載せていきます。 <body> <header> <h1 class="logo">yuri memo</h1> <!-- ハンバーガーメニュー部分 --> <div id="toggle"> <div c
![スマホでフルスクリーンになるレスポンシブメニュー - yuri memo](https://cdn-ak-scissors.b.st-hatena.com/image/square/7a5b0e0e13d211b97c3ff17b7af56c109a4a32f0/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fy%2Fyurixxx8%2F20170305%2F20170305215421.png)