降低IONIC中侧边菜单动画的速度答案

【问题标题】：slow down the speed of side menu animation in IONIC降低IONIC中侧边菜单动画的速度
【发布时间】：2015-07-28 04:59:44
【问题描述】：

当我们开始一个带有“sidemenu”选项的新离子项目并运行应用程序时，我们将能够在滑动或单击菜单切换按钮时查看侧面菜单。

当我们点击菜单按钮时，动画效果很好。但我想减慢侧面菜单的动画速度。这样当我点击按钮时，侧边菜单会慢慢出现。

有没有办法覆盖默认的 CSS 或者有没有办法在 IONIC 中自定义侧边菜单的动画速度？如果是这样，请帮助我。

http://codepen.io/rajeshwarpatlolla/pen/xGOwEv

<ion-side-menus>

    <ion-pane ion-side-menu-content>
      <ion-nav-bar type="bar-positive"
               back-button-type="button-icon"
               back-button-icon="ion-ios7-arrow-back"></ion-nav-bar>
      <ion-nav-view name="menuContent"></ion-nav-view>
    </ion-pane> 

    <ion-side-menu side="left">
      <header class="bar bar-header bar-assertive">
        <div class="title">Left Menu</div>
      </header>
      <ion-content has-header="true">
        <ul class="list">
          <a href="#/event/check-in" class="item">Check-in</a>
          <a href="#/event/attendees" class="item">Attendees</a>
        </ul>
      </ion-content>
    </ion-side-menu>

  </ion-side-menus>

【问题讨论】：

标签： css ionic-framework ionic

【解决方案1】：

你可以覆盖整个 CSS 规则：

.menu-animated {
    -webkit-transition: -webkit-transform 1500ms ease;
    -moz-transition: -moz-transform 1500ms ease;
    transition: transform 1500ms ease;
}

或者简单地添加：

.menu-animated {
    -webkit-transition-duration: 1500ms;
    -moz-transition-duration: 1500ms;
    transition-duration: 1500ms;
}

演示

【讨论】：