[CSS]軽量のスタイルシートで、スマホにもデスクトップにも快適で分かりやすいナビゲーション -Paradeiser

スマホで表示すると三本線のアイコンになるハンバーガーメニューは、確かに小さい画面の問題を解決する方法の一つですが、ベストな選択ではありません。 ハンバーガーメニューの良い点を利用し、悪い点を改善した、スクリプト無しでレスポンシブ対応のナビゲーションを実装するスタイルシートを紹介します。 Paradeiser Paradeiser -GitHub Paradeiserの特徴 Paradeiserのデモ Paradeiserの使い方 Paradeiserの特徴 実装は簡単で、超軽量 Paradeiserは1.3KBのスタイルシート1つだけで、簡単に実装できます。 CSS Only jQueryやスクリプトは使用しません。 レスポンシブ対応 スマホ、タブレット、デスクトップのそれぞれで快適に操作できます。 オーバーフロー ナビゲーションはコンテンツにオーバーフローで表示されます。 スクロール時の

[shibata922922]

“Headroom.js”

[laconic]

モバイルのメニュー / ハンバーガー改善

[gayou]

スクロールで出たり消えたり。

[masakiplus]

スマホで表示すると三本線のアイコンになるハンバーガーメニューは、確かに小さい画面の問題を解決する方法の一つですが、ベストな選択ではありません。

[qrac_jp]

あー...。確かにこのメニュー実装は良さそう。スクロールで出たり消えたりする点も上手く機能している。