Topic: Angular directive mdbStickyHeader is not working
Expected behavior
When I have <mdb-navbar SideClass="navbar fixed-top navbar-expand-lg navbar-dark cyan lighten-3" [containerInside]="false">
, the sticky top bar is working.
Actual behavior
When I have <mdb-navbar SideClass="navbar navbar-expand-lg navbar-dark cyan lighten-3" [containerInside]="false" mdbStickyHeader>
, the top bar is not sticky.
Resources (screenshots, code snippets etc.)
The mdbStickyHeader is not adding the fixed-top
style to the navigation is the issue. I have followed the instructions to include MDBBootstrapModulesPro.forRoot()
in the app module, so it is not the module causing the issue.
Bartosz Termena staff answered 5 years ago
Dear @varghesep
https://mdbootstrap.com/docs/angular/navigation/sticky-header/
Sticky Header was created to allow you to use the functionality that is implemented in Google Chrome on mobile. If you move the page down, navbar will hide, and if you move up, navbar will show up. Sticky Header should not be fixed-top all the time.
Best Regards, Bartosz.
varghesep premium commented 5 years ago
The angular example at https://ng-demo.mdbootstrap.com/navigation/sticky-header shows the navigation as sticky/fixed. So your previous answer is incorrect.
Also, where is the source code for that demo? I can't find it in the ZIP file that I downloaded from your site.
Bartosz Termena staff commented 5 years ago
Hi! Thank you for reporting the problem, we will fix documentation bugs.
You can see the source code in documentation page: https://mdbootstrap.com/docs/angular/navigation/navbar/#sticky-top
Best Regards, Bartosz.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 8.5.0
- Device: Desktop
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: No