Topic: Megamenu Fixed-Top
LAGIER priority asked 6 years ago
Hello everyone,
Would you have the solution for a problem with Mega Menu and the Fixed-Top position on smartphone.
Mega Menu works perfectly on PC with the position "Fixed-Top" and also on the smartphone, but on the screens of the smartphone I can not scroll the navigation menu, while back the page scrolls.
For example here is the address of my web page: https://www.ialpes.com
I also tested with the example code of the page on MDB, it's the same with "Fixed-Top".
If we do not add "Fixed-Top" to: <nav class="navbar navbar-expand-lg navbar-dark fixed-top scrolling-navbar">
, no problem and the navigation and the page scrolls, but not with fixed- top where the navigation remains blocked.
If you could explain the problem for me to keep fixed-top with small screens, it would be wonderful.
Thank you.
Marta Wierzbicka staff answered 6 years ago
Hi,
we will try to find a good solution for the next release. Thank you for patience.
Best,
Marta
LAGIER priority answered 6 years ago
Hello Marta,
I may have found a solution, but I am not a programmer, it may be necessary to purge this code that works.
@media (max-width: 740px) {} @ media (min-width: 800px) and (max-width: 850px) {@ media (min-width: 560px) and (max-width: 650px) {} @ media (min-width: 660px) and (max-width: 700px) {} top-nav-collapse {background-color: # 9da4b1! important} @media (max-width: 992px) {. fixed-top {position : absolute; background-color: # 7283A7 significant}} navbar: not (.top-nav-collapse) {background: transparent} significant .top-nav-collapse {background-color: # 7283A7 significant} @media!.! (max-width: 768px) {. navbar: not (.top-nav-collapse) {background: # 9da4b1! important}} @ media (min-width: 800px) and (max-width: 850px) {. navbar: not (.top-nav-collapse) {background: # 9da4b1 important!}}
LAGIER priority answered 6 years ago
Hello marta,
Thank you for your solution, unfortunately it does not work.
I have not indicated the problem correctly.
The navigation menu collapses completely, that's what I can see on the PC screen with Windows Resizer and others.
Just that we can not scroll through the navigation because of the Fixed-top. as you understand it.
For now I am going to remove the fixed-top until you have a solution to this problem.
Thank you and have a good weekend.
Alain
Marta Wierzbicka staff answered 6 years ago
Hi,
for now, I can recommend you this solution:
#topNav ul li ul {max-height: 50px; overflow:auto; }
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Priority
- Premium support: Yes
- Technology: MDB jQuery
- MDB Version: 4.5.10
- Device: MDB PRO 4.5.13
- Browser: Chrome, FF
- OS: Windows 10 64
- Provided sample code: Yes
- Provided link: Yes