减慢IONIC

时间:2015-05-16 08:38:44

标签: css ionic-framework ionic

当我们开始使用带有'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>

1 个答案:

答案 0 :(得分:7)

您可以覆盖整个CSS规则:

ALTER PROCEDURE [dbo].[usp_GetTestRecords] 
    --@p1 int = 0, 
    --@p2 int = 0
    @groupId nvarchar(10) = 0
AS
BEGIN
    SET NOCOUNT ON;


    SELECT * FROM CUSTOMERS WHERE Id =  @groupId

END

或者只需添加:

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

<强>演示