SlimMenuと呼ばれるレスポンシブ ナビゲーション jQuery プラグインのカスタマイズに苦労しています。ここに jsFiddle を設定しました。最終的には、h1「ロゴ」がコンテナー (ヘッダー) の左側にフロートし、ナビゲーション リンクが右側にフロートするレスポンシブ ヘッダーを作成したいと考えています。折りたたまれたメニューをトリガーすると、ここではプラグインの初期化で 600px のブレークポイントを設定しました。
$('ul.slimmenu').slimmenu({
resizeWidth: '600'
});
これは、jsFiddle の「結果」ペインの幅を変更することで確認できます。次の図に示すように、ドロップダウン リストの項目でビューポートを 100% 幅で埋めたいと思います。
このプラグインは、トリガーされたときにハンバーガー メニュー アイコンの横にテキストを表示するように設定されています (この場合は「メニュー」です)。問題はヘッダーとナビゲーション要素のフローティングにあり、おそらくコンテナー内に配置して、リスト項目にメディアクエリを対象とした調整を行う必要があると思われますが(?)、この流れでの私の試みはうまくいきませんでした.
ここで助けてくれてありがとう。解決策を見つけた人には喜んでコーヒーを買います:)