ion-slide-box-tabs

ion-slide-box-tabs copied to clipboard

Is there a way to have the tabs stick to the top of the screen (like a sticky header) and not have it scroll with the content? Something similar to this when you scroll up/down Any help will be highly appreciated. Thanks.

a few tweaks with ion-content should do it

  <ion-content has-bouncing="false" scroll="false">
         <ion-slide-box show-pager="false" ion-slide-tabs slide-tabs-scrollable on-slide-changed="slideHasChanged($index)">
          <ion-slide ion-slide-tab-label="All">
            <ion-content scroll="true">
             <ion-refresher on-refresh="doRefresh()" pulling-icon="ion-load-d" spinner="ios-small"></ion-refresher>
              <ng-include src="'templates/partials/notifications-all.html'"></ng-include>
            </ion-content>
          </ion-slide>
          <ion-slide ion-slide-tab-label="Liked">
              <ion-content scroll="true">
                <ion-refresher on-refresh="doRefresh()" pulling-icon="ion-load-d" spinner="ios-small"></ion-refresher>
                <ng-include src="'templates/partials/notifications-liked.html'"></ng-include>
              </ion-content>
          </ion-slide>
        </ion-slide-box>
 </ion-content>

 .slider {
    height: 90%;
}

Howdy. I have the following setup and would love it if I can have the slide-tabs stick to the top when they reach the top. By default, they will be partially down the screen, below a map. Any thoughts on how I can make the bar sticky just below the header? Thanks!