JKnorr91 / ion-slide-box-tabs

An Add-On directive for the ion-slide-box, that adds tabs to the slide box, known from the Android Material Design specification
MIT License
248 stars 110 forks source link

How do you make the tabs static (non-scrollable)? #9

Open kehnee opened 9 years ago

kehnee commented 9 years ago

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.

kevincobain2000 commented 8 years ago

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%;
}
cmvee commented 7 years ago

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!

screen shot 2017-04-05 at 10 04 11 pm