git 地址: https://github.com/Augus/ngAnimate/

使用方法:

下载后,

1、引入ngAnimate.js(依赖jquery);

2、引入 ng-animate.css

3、在需要ng-show的标签上,加上以下效果的类名

显示效果类名:

  • toggle
  • spin-toggle
  • slide-left
  • slide-right
  • slide-top
  • slide-down
  • bouncy-slide-left
  • bouncy-slide-right
  • bouncy-slide-top
  • bouncy-slide-down
  • scale-fade
  • scale-fade-in
  • bouncy-scale-in
  • flip-in
  • rotate-in

非常简单,效果非常好看,可以自行选择自己喜欢的效果使用;

具体效果体验可以参考:http://augus.github.io/ngAnimate/

ionic 页面动画 ngAnimate的更多相关文章

  1. [Android实例] app引导页(背景图片切换加各个页面动画效果)(申明:来源于网络)

    [Android实例] app引导页(背景图片切换加各个页面动画效果)(申明:来源于网络) 地址: http://www.eoeandroid.com/thread-918356-1-1.html h ...

  2. 每日CSS_滚动页面动画效果

    每日CSS_滚动页面动画效果 2021_1_13 源码链接 1. 代码解析 1.1 html 代码片段 <section> <h2>开 始 滑 动</h2> < ...

  3. ionic页面间跳转的动画实现

    1. 在<ion-view>标签中加入: nav-direction="back"或nav-direction="forward" 2.用$stat ...

  4. ionic 页面加载事件及loading动画

    页面加载完成事件(非刷新情况下,页面切换是不会重复触发此事件的,只在第一次进入页面时触发,需要重复触发的话请使用 $ionicView.enter 事件) angular.module('app.co ...

  5. app引导页(背景图片切换加各个页面动画效果)

    前言:不知不觉中又加班到了10点半,整个启动页面做了一天多的时间,一共有三个页面,每个页面都有动画效果,动画效果调试起来麻烦,既要跟ios统一,又要匹配各种不同的手机,然后产品经理还有可能在中途改需求 ...

  6. Ionic页面加载前 ionic页面加载完成 ionic页面销毁执行的事件

    ionic 中$ionicView.beforeEnter(页面刚加载前)  $ionicView.afterEnter  (页面加载完成) $destroy(页面销毁) 广播事件 //ionic c ...

  7. wow.js让css3动画变动更有趣(滚动页面动画模拟懒加载特效)

    CSS3的出现给网站页面增加了活力,网站增色不少,有这么小小的一款插件就能做出很多动画效果. 最重要的是它:简单易用.轻量级.无需 jQuery......他就是wow.js 地址:https://d ...

  8. html常见页面动画插件

    wow.js页面滚动动画 scrollever.js页面滚动动画 textillate.js页面字体效果 ihover.js手表hover效果插件 loaders.css页面预加载动画

  9. easing.js让页面动画丰富起来

    jQuery Easing是一款比较老的jQuery插件,在很多网站都有应用,尤其是在一些页面滚动.幻灯片切换等场景应用比较多.它非常小巧,且有多种动画方案供选择,使用简单,而且免费. <scr ...

随机推荐

  1. jmeter使用问题——将接口返回变量存储成csv文件

    在使用jmeter做接口测试时,一整个jmx测试计划中,存在多个线程,多个接口的测试 但是接口可以分类,比如业务接口.查询接口.更新接口等 考虑自动化接口测试一般都是一次性的,有完整的闭环链路,一般步 ...

  2. 地图组件demo

    高德地图API(demo未完善) 1:声请JSAPI的key值:http://lbs.amap.com/dev/#/(已声请key名称:demo-javascipt key:7cbbed2d9a0c0 ...

  3. 【Java中级】(二)集合框架

    2.1.ArraList 1.自增长 容器的容量"capacity"会随着对象的增加,自动增长 只需要不断往容器里增加英雄即可,不用担心会出现数组的边界问题. 2.常用方法 关键字 ...

  4. 【原创】这一次,Chrome表现和IE11一样令人失望,围观群众有:Edge,Firefox

    前言 俗话说,常在河边走哪能不湿鞋,天天和浏览器打交道,发现浏览器竟然也隐藏BUG也不是新鲜事了.可以看下我之前的文章: [原创]分享IE7一个神奇的BUG(不是封闭标签的问题,的确是IE7的BUG) ...

  5. c#六大设计原则(以仪器代码为例)

    [有格式的原文请到https://www.cnc6.cn/c六大设计原则/文末下载] 软件设计原则常见的有6大原则,分别为: ①单一职责原则: ②开闭原则: ③依赖倒置原则: ④里氏替换原则: ⑤接口 ...

  6. python课堂整理13---函数的作用域及匿名函数

    name = 'alex' def foo(): name = 'jinling' def bar(): print(name) return bar a = foo() print(a) 阅读上述代 ...

  7. javascript获取指定区间范围随机数

    //获取指定区间范围随机数,包括lowerValue和upperValuefunction randomFrom(lowerValue,upperValue){    return Math.floo ...

  8. CSDN 免积分下载

    你可能不相信这个标题,那么打开下面的链接试试吧 ↓↓↓ Github项目 最新功能 ↓↓↓ 0积分资源搜索 0积分资源搜索(备用地址) CSDN资源导出 CSDN资源下载体验群 (每日可免费下载一次) ...

  9. 移动端H5多终端适配解决方案

    推荐三篇文章: 1.来自手淘团队的开源技术flexibal.js github地址:https://github.com/isHelenaChan/flexible 2.来自“大漠”(就职于淘宝,也是 ...

  10. let和const解构赋值

    1.let和const:最基础也很容易理解的,let是 声明一个变量,const是声明一个常量. 具体细节看如下实例代码 { let a=; console.log(a) } // console.l ...