モバイル ビューで、ユーザーがリンクをクリックしたときにこのナビゲーション バーを閉じるにはどうすればよいですか?

Question

ユーザーがリンクをクリックして Web サイトを閲覧するとき、ナビゲーション バーは閉じられませんか?

ナビゲーション バーを閉じるために、クリック イベント リスナーを各リンクに追加しようとしましたが、機能しません。 また、アクティブな位置にあるハンバーガー メニュー アイコン (つまり、X) の位置が適切に調整されていません。しかし、主な問題は、ナビゲーション バーをクリックすると折りたたまれることです。

リーリー リーリー リーリー

Answer 1

メニューをレスポンシブに設定していると思います。つまり、モバイル デバイスにも適しています。

1. これには @media screen CSS を使用します
2. ウィンドウの幅がタブまたはモバイルデバイスに近い場合はハンバーガーアイコンを表示し、それ以外の場合はこのアイコンを非表示にします。
3. メニュー div (モバイルまたはタブ) に閉じるアイコンを追加して、メニューを閉じます。

このソリューションがお役に立てば幸いです

ハンバーガー アイコンが付いた次のモバイル ビュー ナビゲーション バーコードを参照できます。

リーリー リーリー