Does anyone know how I could create a vertical sliding menu in Angular ? Like the new facebook sliding menu that comes from left side of the screen.
There are couple of fiddles available but all are for jquery
A <mat-sidenav> can be opened or closed using the open() , close() and toggle() methods.
For <mat-sidenav> only (not <mat-drawer> ) fixed positioning is supported. It can be enabled by setting the fixedInViewport property. Additionally, top and bottom space can be set via the fixedTopGap and fixedBottomGap. These properties accept a pixel value amount of space to add at the top or bottom.
The <mat-sidenav>, an Angular Directive, is used to create a side navigation bar and main content panel with material design styling and animation capabilities. <mat-sidenav-container> - Represents the main container. <mat-sidenav-content> - Represents the content panel. <mat-sidenav> - Represents the side panel.
You need to create a directive
to do that. You can start with snap.js (Angular-Snap).
DEMO
<snap-drawer>
I'm in a drawer!
</snap-drawer>
<snap-content>
I'm your main content!
</snap-content>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With