Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Vertical slide menu in Angular [closed]

Tags:

angularjs

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

like image 980
runtimeZero Avatar asked Aug 15 '13 22:08

runtimeZero


People also ask

How do you close a Sidenav mat?

A <mat-sidenav> can be opened or closed using the open() , close() and toggle() methods.

How do you fix Sidenav mats?

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.

What is Sidenav?

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.


1 Answers

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>
like image 168
EpokK Avatar answered Sep 26 '22 05:09

EpokK