Navbar with autohide function - offcanvas problem

[phrizm]

Hello Basti! It's me once again.

Im playing with navbar settings, and get some wired behaviour of off canvas mobile menu with this example:

https://bootstrap-menu.com/detail-autohide.html

https://www.northwestalps.com/ --my example

Im glad search section is working, but i bet there is some easy work around.

Ty so much.

[crftwrk]

Hi Richard,

This won't work that way because offcanvas navbar is inside the navbar. You are using transform on fixed-top wrapper and of course offcanvas is transformed as well.

You have to create 2 offcanvas menus.

• Hide existing offcanvas on small devices by adding d-none d-lg-block class to it
• Copy offcanvas outside the fixed-top div, hide on large devices by adding d-lg-none class. Change id.
• Change the data-bs-target in navbar-toggler to new offcanvas id.

BTW please mark always solutions as answered. This will others users who want to do the same help to find the solution.

Thanks ;-)

[phrizm]

Basti thank you for your response. Sorry for my bad behavior but still need to enter into github mode. Yes I will for sure mark things as answered. Il Dom 26 Feb 2023, 13:19 Basti ***@***.***> ha scritto:

…

Hi Richard, This won't work that way because offcanvas navbar is *inside* the navbar. You are using transform on fixed-top wrapper and of course offcanvas is transformed as well. You have to create 2 offcanvas menus. - Hide existing offcanvas on small devices by adding d-none d-lg-block class to it - Copy offcanvas *outside* the fixed-top div, hide on large devices by adding d-lg-none class. Change id. - Change the data-bs-target in navbar-toggler to new offcanvas id. BTW please mark always solutions as answered. This will others users who want to do the same help to find the solution. Thanks ;-) — Reply to this email directly, view it on GitHub <#408 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ANQHWEQZQLG7BXSNEERL2FDWZNC4LANCNFSM6AAAAAAVIL4B64> . You are receiving this because you authored the thread.Message ID: ***@***.***>