How to add scroll in ion-tabs with several tabs?

Question

How to add scroll in ion-tabs with several tabs?

Navigation

#1 by (1 votes)

0

I'm developing an ionic app, with this, I have a page with tabs, but I intend to put 10 tabs and it will not fit on the devices, like putting a horizontal scroll to the tabs?

  <ion-tab title="Home" icon-on="ion-ios-filing" icon-off="ion-ios-filing-outline">
   <!-- Tab 1 content -->
  </ion-tab> 

  <ion-tab title="About" icon-on="ion-ios-clock" icon-off="ion-ios-clock-outline">
    <!-- Tab 2 content -->
  </ion-tab>
  <ion-tab title="About" icon-on="ion-ios-clock" icon-off="ion-ios-clock-outline">
    <!-- Tab 3 content -->
  </ion-tab>
  <ion-tab title="About" icon-on="ion-ios-clock" icon-off="ion-ios-clock-outline">
    <!-- Tab 4 content -->
  </ion-tab>
  <ion-tab title="About" icon-on="ion-ios-clock" icon-off="ion-ios-clock-outline">
    <!-- Tab 5 content -->
  </ion-tab>
  <ion-tab title="About" icon-on="ion-ios-clock" icon-off="ion-ios-clock-outline">
  </ion-tab>
</ion-tabs>

android ionic ios

asked by anonymous 02.02.2016 / 22:56

1 answer

Error publishing site Jquery captures div id in scroll and changes title

score 1 · Answer 1

Still having this problem? I was able to resolve a resemblance today, in my the tabs are dynamic, the user can add as many as they want and delete as well. Home To solve the problem I added a minimum size for the tabs and added the scroll x of the div that has the tabs.

.tab-item{
    min-width: 90px;
}
.tabs{
    overflow-x: scroll;
    overflow-y: hidden;
}