ナビゲーションにホバーすると、下層のナビゲーションが出てくる、いわゆるドロップダウンメニューを作ってみました。 調子に乗ってレスポンシブで、スマホのときはアコーディオンメニューにしようとか考えて、結構苦労しました・・・。 デモはこちらから DEMO 以下、コードです。 HTML liの中にulを入れる入れ子構造です。普通に打つとかなりめんどくさいですね。何かしら楽をする方法を使う方がいいでしょう。私の場合はemmetでやりました。 CSS 動きに関わる部分は特にありません。ほぼ見た目を整えるために使ってます。「>」は子要素を指定するセレクタです。今回みたいな入れ子構造のものは子要素のみを指定してあげればclass・idなしでも実装できます。(メンテナンス性とかの良し悪しはさておき・・・) jQuery 画面サイズによってイベントを切り替えています。700pxより大きい場合はhoverイベン
![ドロップダウンメニュー(レスポンシブ)を実装してみた](https://cdn-ak-scissors.b.st-hatena.com/image/square/02449806310b0775052aa33ac8d571d6cda9c826/height=288;version=1;width=512/https%3A%2F%2Fyori3.com%2Fblog%2Fwp-content%2Fuploads%2F2016%2F02%2Fdrower.png)