angular animate 有3种:1,css transition. 2,css keyframe. 3,javascript 用jquery的animate方法;

1,2 两种是纯粹css的,3是JS方法,可以使用外部库,比如Jquery。假如要在IE8下使用的话,估计只能使用JS的方法;

ag的animate触发是靠ag的事件来触发绑定在需要动画元素上的cssClass。

纯CSS的动画的阶段有2个阶段:正向和反向(理解为:从隐藏到显示为正向,显示到隐藏为反向)。

举个栗子,

正向:

阶段1,opacity:0; ng-enter

阶段2:opacity:1; nt-enter-active

反向:

阶段1:opacity:1;ng-leave

阶段2:opacity:0;ng-leave-active;

以上就是一般的动画写法;

但是directive的动画写法都一点点不同。

比如ng-show、ng-hide事件:当绑定了ng-show和hide事件元素在进行显示和隐藏的时候读取cssClass属性,然后再css文件中找到写有

.cssClass.ng-hide的属性和.cssClass中的属性。动画的事件依据写在cssClass中的transition来决定。

angular animate的更多相关文章

  1. ng animate

    要在angular中加入动画必须引入angular.animate.js插件,然后就可以在module中引入ngAnimate模块.如: var module1 = angular.module('m ...

  2. 基于angular+bower+glup的webapp

    一:bower介绍 1:全局安装安装bower cnpm i -g bower bower常用指令: bower init //初始化文件 bower install bower uninstall ...

  3. 初试angularjs动画(animate)

    angularjs不同版本的代码写法各有千秋,动画模块的写法也各有不同,以下是收集到的两大版本的写法,各位请: angularjs1.1.5版本(1.2之前) index.html代码: <!D ...

  4. 基于AngularJS/Ionic框架开发的性能优化

    AngularJS作为强大的前端MVVM框架,虽然已经做了很多的性能优化,但是我们开发过程中的不当使用还是会对性能产生巨大影响. 下面提出几点优化的方法: 1. 使用单次绑定符号{{::value}} ...

  5. angular 2 animate 笔记

    好久没有在这里写点笔记了.时隔已久,angular1 去 angular2 咯 笔记来源:https://angular.cn/docs/ts/latest/guide/animations.html ...

  6. Phonegap集成angular/bootstrap/animate.css教程

    1,phonegap集成angular 按照这篇文档的步骤:http://projectpoppycock.com/angularjs-phonegap-and-angular-seed-lets-g ...

  7. 深入理解jQuery、Angular、node中的Promise

    最初遇到Promise是在jQuery中,在jQuery1.5版本中引入了Deferred Object,这个异步队列模块用于实现异步任务和回调函数的解耦.为ajax模块.队列模块.ready事件提供 ...

  8. Angular移除不必要的$watch之性能优化

    双向绑定是Angular的核心概念之一,它给我们带来了思维方式的转变:不再是DOM驱动,而是以Model为核心,在View中写上声明式标签.然后,Angular就会在后台默默的同步View的变化到Mo ...

  9. Angular定义服务-Learn By Doing

    1.服务(Service)介绍 Angular services are substitutable objects that are wired together using dependency ...

随机推荐

  1. 配置mysql远程访问权限,大家可能掉过的那些坑~

    1 作为互联网技术从业人 或者粗暴点说:作为一个程序猿.测试从业者 如果没掉过一些坑,都不好意思说自己混过技术圈     2 今天重点讲:mysql开启远程访问权限的那些坑- 对于mysql开启远程访 ...

  2. javascript-抽象工厂模式

    抽象工厂模式笔记   1.抽象工厂模式创建多个抽象类,创建出的结果是一个类簇(这里是抽象类的集合)   2.抽象工厂中传入的父类是否是抽象工厂方法创建的抽象类进行判断,不是则抛出错误   3.子类通过 ...

  3. IIS安装和使用(Windows Server 2003)

    1.安装IIS ①将系统盘插入光驱 ②进入:控制面板--添加/删除Windows组件--选择“应用程序服务器”--点击“详细信息” ③选择:ASP.NET和Internet信息服务(IIS),点击“确 ...

  4. 从Mysql数据库中导入导出表结构

    1.从Mysql数据库中导入sql表 很简单,只需要一个命令即可搞定:[root@localhost ~]# mysql -uroot -piweb_xxx_mysql iweb < modif ...

  5. 获取下拉框的value和值

    jsp: <td class="formItem_content"> <select name="label" id = "labe ...

  6. android EditText光标位置(定位到最后)

    方法:edittext.setSelection(int); et.setText(content);//设置EditText控件的内容et.setSelection(content.length() ...

  7. 基于Qt5.5.0的sql数据库、SDK_tts文本语音朗读的CET四六级单词背诵系统软件的编写V1.0

    作者:小波 QQ:463431476 请关注我的博客园:http://www.cnblogs.com/xiaobo-Linux/ 我的第二款软件:CET四六级单词背诵软件.基于QT5.5.0.sql数 ...

  8. [转]Membership三步曲之入门篇 - Membership基础示例

    本文转自:http://www.cnblogs.com/jesse2013/p/membership.html Membership三步曲之入门篇 - Membership基础示例   Members ...

  9. MMORPG大型游戏设计与开发(客户端架构 part5 of vegine)

    客户端异常捕获,是一件必然的事情,特别是在开发的时候就更需要这些有利于找出问题原因的捷径.区别于服务器的是,客户端基本上是以界面为主,你很难在正常运行程序的情况下进行一些输出的监视,如一些日志的记录. ...

  10. 最新discuz模版制作7堂课让你精通discuz模版制作

    第一课  基本知识储备一.基本 HTML 代码二.网站语言编码  三.DIV+CSS 认知及应用 第二课  必备软件.环境配置及程序安装 第三课  DISCUZ 构架详解 一.DISCUZ 基础构架讲 ...