サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
ノーベル賞
yori3.com
ナビゲーションにホバーすると、下層のナビゲーションが出てくる、いわゆるドロップダウンメニューを作ってみました。 調子に乗ってレスポンシブで、スマホのときはアコーディオンメニューにしようとか考えて、結構苦労しました・・・。 デモはこちらから DEMO 以下、コードです。 HTML liの中にulを入れる入れ子構造です。普通に打つとかなりめんどくさいですね。何かしら楽をする方法を使う方がいいでしょう。私の場合はemmetでやりました。 CSS 動きに関わる部分は特にありません。ほぼ見た目を整えるために使ってます。「>」は子要素を指定するセレクタです。今回みたいな入れ子構造のものは子要素のみを指定してあげればclass・idなしでも実装できます。(メンテナンス性とかの良し悪しはさておき・・・) jQuery 画面サイズによってイベントを切り替えています。700pxより大きい場合はhoverイベン
このページを最初にブックマークしてみませんか?
『yori3.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く