CODEWITHSUNDEEP
angularjsionic-framework
Philomath
Philomath

Reputation: 1163

Ionic navbar hides hamburger icon

I am new to angular and ionic and would was trying to make an app

<ion-side-menus >
<ion-side-menu-content>
    <ion-nav-bar class="bar-assertive nav-title-slide-ios7">
      <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
    </ion-nav-bar>
    <ion-nav-view></ion-nav-view>
  </ion-side-menu-content>

  </ion-side-menu-content>

<ion-side-menu side="left">
    <ion-header-bar class="bar-energized ">
      <h1 class="title">My Test</h1>
    </ion-header-bar>

    <ion-content class="has-header">
      <ion-list>
        <ion-item href="#/" class="item-icon-left" menu-close><i class="icon ion-home"></i> Home</ion-item>

      </ion-list>
    </ion-content>
 </ion-side-menu>

My side menu hamburger icon doesnt show up and is always hidden behind the navbar.If i remove the navbar then the icon is visible! how to resolve this please help!

Upvotes: 0

Views: 975

Answers (1)

Anuj
Anuj

Reputation: 650

Working code.. Use Ion header .You was using 2 times

<ion-side-menus >
<ion-side-menu-content>
       <ion-header-bar class="bar-positive">
     <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
      <h1 class="title" >Slider </h1>
    </ion-header-bar>   
  </ion-side-menu-content>

<ion-side-menu side="left">
    <ion-header-bar class="bar-energized ">
      <h1 class="title">My Test</h1>
    </ion-header-bar>

    <ion-content class="has-header">
      <ion-list>
        <ion-item href="#/" class="item-icon-left" menu-close><i class="icon ion-home"></i> Home</ion-item>

      </ion-list>
    </ion-content>
 </ion-side-menu>

Upvotes: 1

Related Questions