Onsen-UI - ons-tabbar page transition

Question

I'm using ons-tabbar for app navigation, is there any "out of the box" page transition I could specify, i.e "slide in from right", when navigating tabs, or any "best practice?

<ons-tabbar>
    <ons-tabbar-item
          active="true"
          label="Home"
          icon="home"
          page="navigator1.html"></ons-tabbar-item>
    <ons-tabbar-item
          label="Create Item"
          icon="plus"
          page="navigator2.html"></ons-tabbar-item>
    <ons-tabbar-item
          label="View Items"
          icon="fa-lightbulb-o"
          page="browse.html"></ons-tabbar-item>
    <ons-tabbar-item
          label="Settings"
          icon="gear"
          page="page3.html"></ons-tabbar-item>
</ons-tabbar>

Answer 1

solved it like this:

.topcoat-page__bg {
    -webkit-animation: pageleftright .25s;
    animation: pageleftright .25s;
}

@-webkit-keyframes pageleftright {
    from {left: 100%;}
    to {left: 0;}
}

@keyframes pageleftright {
    from {left: 100%;}
    to {left: 0;}
}

Will work for pages with a root element.

For regular pages: <ons-page>

.page {
    -webkit-animation: pageleftright .25s;
    animation: pageleftright .25s;
}

Mix them

.page, .topcoat-page__bg {
    -webkit-animation: pageleftright .25s;
    animation: pageleftright .25s;
}

Answer 2

Simply add animation attribute on Tabbar as below

<ons-tabbar animation="fade">
    <ons-tabbar-item
          active="true"
          label="Home"
          icon="home"
          page="navigator1.html"></ons-tabbar-item>
    <ons-tabbar-item
          label="Create Item"
          icon="plus"
          page="navigator2.html"></ons-tabbar-item>
    <ons-tabbar-item
          label="View Items"
          icon="fa-lightbulb-o"
          page="browse.html"></ons-tabbar-item>
    <ons-tabbar-item
          label="Settings"
          icon="gear"
          page="page3.html"></ons-tabbar-item>
</ons-tabbar>

based on documentation valid values are only "none" and "fade"

http://onsen.io/guide/components.html#ons-tabbar