By default in Ionic side menu pushes the current page when the side menu button is clicked. But i need to overlap the side menu over the current page as in most of the apps. How to do that? Where should i change the code? Just consider a default side menu template from ionic.
<ion-side-menus enable-menu-with-back-views="false">
<ion-side-menu-content>
<ion-nav-bar class="bar-positive bar-blue">
<ion-nav-back-button></ion-nav-back-button>
<ion-nav-buttons side="left">
<button class="button button-icon button-clear ion-navicon" menu-toggle="left"></button>
</ion-nav-buttons>
<ion-nav-buttons side="right">
<a menu-close href="#/app/playlists" class="cancelbutton">
<button class="button button-icon button-clear " ng-hide=cancelflag>cancel</button>
</a>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view name="menuContent"animation="fade-in-out"></ion-nav-view>
</ion-side-menu-content>
<ion-side-menu side="left">
<ion-header-bar class="bar-positive bar-image sidemenu-header">
<h1 class="title title-left">{{currentuser}}</h1>
</ion-header-bar>
<ion-content>
<ion-list>
<!-- <ion-item menu-close href="#/testing">
testinglogin
</ion-item> -->
<ion-item menu-close href="#/app/home" ng-show=adminflag>
<label class="item-input labelclearpadding">
<i class="icon paddingicon"><img src="img/user.png" alt="" class="placeholder dateicon"/></i>
all details
</label>
</ion-item>
</ion-list>
<ion-list>
</ion-list>
</ion-content>
</ion-side-menu>
</ion-side-menus>
I am working on ionic 2 and this is helpful for the same only.
I was also searching for the same issue-
I read the document here.
Menu Types explain very clearly to add type= "overlay" and got my task accomplished
<ion-menu [content]="content" side="right" type="overlay">
................
...............
lines of code goes here
...............
................
</ion-menu>
Where -
Side => being toggle from right
type => display type of menu on current screen.
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