実例:ナビゲーションバー
ナビゲーションバーコンポーネントのすべてのレスポンシブとコンテナオプションのデモ。
※"v5.0.0"での変更はv5.0.0-alpha版、v5.0.0-beta版での変更も含みます。
※"v5.2.0"での変更はv5.2.0-beta1での変更も含みます。
※"v5.3.0"での変更はv5.3.0-alpha版での変更も含みます。
※"v5.2.0"での変更はv5.2.0-beta1での変更も含みます。
※"v5.3.0"での変更はv5.3.0-alpha版での変更も含みます。
幅一杯にナビゲーションバーv5.3.1設定変更
メニューがビューポートの両端に広がったナビゲーションバーの実例。
メニューのみがサイトの本体と同じ幅のナビゲーションバーv5.3.1設定変更
サイトの本体の両端と揃ったナビゲーションバーの実例。
サイトの本体と同じ幅のナビゲーションバーv5.3.1設定変更
メニュー部分のみがサイトの本体の両端と揃ったナビゲーションバーの実例。
レスポンシブ・コンテナを使用したナビゲーションバーv5.0.0新設 v5.3.1設定変更
ビューポートサイズに応じて両端の位置が変化するナビゲーションバーの実例。
レスポンシブ・ナビゲーションバーv5.2.3一部追加 v5.3.1設定変更
ナビゲーションバーの様々な配置のバリエーション。
オフキャンバス付きナビゲーションバーv5.2.0新設 v5.3.0設定変更
オフキャンバスコンポーネントを使用したナビゲーションバーの実例。
静的トップナビゲーションバーv5.3.1設定変更
いくつかの追加コンテンツを持つ単一の静的なナビゲーションバーの実例。
トップ固定のナビゲーションバーv5.3.1設定変更
いくつかの追加コンテンツを持つ固定されたトップナビゲーションバーの実例。
ボトム固定のナビゲーションバーv5.3.1設定変更
いくつかの追加コンテンツを持つ固定されたボトムナビゲーションバーの実例。
最上部に達すると固定されるナビゲーションバーv5.3.1設定変更
スクロールして最上部に達すると最上部に固定されるナビゲーションバーの実例。
最下部に達するまで固定されるナビゲーションバーv5.2.0新設 v5.3.1設定変更
スクロールして最下部に達するまで最下部に固定されるナビゲーションバーの実例。
オフキャンバスナビゲーションバーv5.0.0カテゴリ変更 v5.3.0設定変更
拡張可能なナビゲーションバーをスライドオフキャンバスメニューに変更(オフキャンバスコンポーネントは不使用)。