下载animate.css
<transition name="v">
<div class="content">需要做动画的内容</div>
</transition> <style>
  .content{
    //也可以有其他的样式
    transition: all 0.4s linear;
  }
  .v-enter-active, .v-leave-active{
    /* 进入时和离开时的状态 */
    transition: all 0.4s linear;
  }
  v-enter, .v-leave-active{
    /* 刚进入和离开的状态 */
    opacity:0;
    transform:translate3D(24px,0,0);
  }
</style>

  

vue2.0学习之动画的更多相关文章

  1. vue2.0学习笔记之路由(二)路由嵌套+动画

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. vue2.0学习笔记之路由(二)路由嵌套

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. VUE2.0学习总结

    摘要: 年后公司项目开始上vue2.0,自己对学习进行了总结,希望对大家有帮助! VUE2.0学习 vue介绍 vue是什么? https://vuefe.cn/guide vue也是一个数据驱动框架 ...

  4. Vue2.0学习--Vue数据通信详解

    一.前言 组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.组件间如何传递数据就显得至关重要.本文尽可能罗列出一些常见的数据传递方式,如p ...

  5. vue2.0学习教程

    十分钟上手-搭建vue开发环境(新手教程)https://www.jianshu.com/p/0c6678671635 如何在本地运行查看github上的开源项目https://www.jianshu ...

  6. vue2.0 之 过渡动画transtion

    过渡的类名: 在进入/离开的过渡中,会有 6 个 class 切换 (v 是前缀,name = v) v-enter:定义进入过渡的开始状态.在元素被插入时生效,在下一个帧移除. v-enter-ac ...

  7. Vue2.0学习笔记一 :各种表达式

    #,过滤器 #,在Vue2.x中,过滤器只能在mustache绑定中使用,为了在指令帮定中实现同样的行为,你应该使用计算属性:     #,过滤器可以串联 {{ message | filterA | ...

  8. vue2.0学习(二)

    1.关于模板渲染,当需要渲染多个元素时可以 <ul> <template v-for="item in items"> <li>{{ item. ...

  9. vue2.0学习小列子

    参考地址:https://segmentfault.com/a/1190000006165434 例1: <template> <div id="app"> ...

随机推荐

  1. centos 7 内存压测测试--memtester工具

    1.下载memteste工具 官方:http://pyropus.ca/software/memtester/ wget http://pyropus.ca/software/memtester/ol ...

  2. sersync配置

    只记录了自己的操作步骤,详细信息也可以参考https://www.cnblogs.com/sellsa/p/5345092.html 安装sersync 将sersync安装包解压后会有两个配置文件 ...

  3. Python笔记_第四篇_高阶编程_正则表达式_1.正则表达式简介(re模块)

    1. 从一个判断手机号的问题引入: 如果给你一个字符串,去判断是否是一个手机号码,我们通过之前的学习可以有如下代码: # 如果用普通的方式去检验一个电话号码非常麻烦. def checkPhone(s ...

  4. Java自学-泛型 泛型转型

    Java 中的子类泛型转型成父类泛型 步骤 1 : 对象转型 根据面向对象学习的知识,子类转父类 是一定可以成功的 package generic; import charactor.ADHero; ...

  5. 熟练使用WebApi开发

    在建立WebApi框架的时候,要想自己的业务需求是什么.例如PC端(前端),APP端都要使用的同一接口,就得考虑Webapi来提供接口支持了.最近公司刚好让我整合一下公司的接口项目(有WebServi ...

  6. Java线程——synachronized关键字的作用(一)

    在并发编程中,多线程同时并发访问的资源叫做临界资源,当多个线程同时访问对象并要求操作相同资源时,分割了原子操作就有可能出现数据的不一致或数据不完整的情况,为避免这种情况的发生,我们会采取同步机制,以确 ...

  7. linux设置网络三种方法

    http://blog.csdn.net/u010003835/article/details/52233296

  8. malloc 底层实现及原理

    摘要:偶尔看到面试题会问到 malloc 的底层原理,今天就来记录一下,毕竟学习要“知其所以然”,这样才会胸有成竹. 注:下面分析均是基于 linux 环境下的 malloc 实现.步骤是:先总结结论 ...

  9. zip和rar文件的contentType

    zip.rar.msi等文件使用Chrome提交的ContentType都为null,IE可以正确获取

  10. android设备内部添加apn信息

    由于工作原因今天需要给多台android设备中写入某张sim卡的apn相关信息,虽然可以通过sqlite命令写sql语句来写入到设备中,但设备一多起来就太低效了,所以在学习的过程中摸索着写了一个将ap ...