Tutorialsplane

Materialize SideNav


Materialize SideNav Menu : SideNav is one of the main component of any webpage which provides users side navigation. It is very easy to create sidenav in Materialize framework. As it is jQuery plugin so it needs the initialization. Here in this tutorial we are going to explain how you can create side navigation Menu in Materialize. You can also use our online editor to edit and run the code online.


Materialize SideNav Example

There are basically two parts of sidenav- 1. HTML, 2. jQuery. HTML part contains the sidenav html menu item stuffs and jQuery contains the script to initialize the side navigation menu. Let us create a simple navigation menu as below-

Materialize SideNav Menu with Dropdown Example

 
menu

Try it ยป

If you run the above example it will produce the output something like this-

Materialize Tutorial

Css

Component

JavaScript