下载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. Django项目同步到码云

    本篇博客主要记录下将刚刚初始化后的Django项目部署到码云中,首先我们需要到码云中注册一个账号,下面会讲解下如何在码云中建立一个仓库,再将其克隆到本地.最后将本地的项目推送到码云的仓库中. 码云内初 ...

  2. sql优化从300秒到7秒

    原始sql select b.jd 街道,b.rglm 楼宇,zzrl 楼宇编号,count(oname) 入楼企业总数, (select count(oname) from ${tablename} ...

  3. xv6的启动过程

    bootloader 1. bootasm.S : start32 2. bootmain.c : bootmain kernel 3. main.c : main 4. proc.c : useri ...

  4. JavaScript 之 原型及原型链

    对象[回顾] 通过字面量创建对象 //通过字面量创建对象 var obj1 = { name:'Jack', age: 18 } 通过系统自带的构造函数构造对象 // 通过系统自带的构造函数构造对象 ...

  5. 【十日冲刺计划】第一日 星遇Sprint1计划会议成果

    ——小组成员 赵剑峰 张傲 周龙海 Sprint 计划会议1:定出 Sprint 目标和既定产品Backlog. 会议进程(1小时) • 首先对sprint目标进行总体介绍,概括星遇的backlog, ...

  6. 逃生(地图上的dp)

    蒜头君在玩一款逃生的游戏.在一个n×m 的矩形地图上,蒜头位于其中一个点.地图上每个格子有加血的药剂,和掉血的火焰,药剂的药效不同,火焰的大小也不同,每个格子上有一个数字,如果格子上的数字是正数说明是 ...

  7. 特斯拉私有化VS蔚来上市,电动汽车站在十字路口上

    当下,对于电动汽车来说既是一个最好的时代,也是一个最坏的时代.好的一面是业界.投资者.消费者对电动汽车的关注度愈来愈高,坏的一面则是电动汽车正处于一个非常尴尬的处境.从大环境来看,电动汽车自身的产品力 ...

  8. Python对象赋值、浅拷贝、深拷贝

    Python中,基本数据类型,理解为常见数据类型:布尔型.整型.浮点型.字符串.列表.元组.字典.集合,随语言不同而不同,但是根据在内存中存储方式的不同,区分开原子类型和容器类型. 对象赋值 对象的赋 ...

  9. 为什么常用 Map<> map = new HashMap()

    在初学Java的时候,经常能看到教材上的写法,使用了接口Map来引用一个map,而不是它的具体实现,那么这样做的好处是什么呢? <Effective Java>第52条:通过接口引用对象 ...

  10. BeanFactory和ApplicationContext的区别(Bean工厂和应用上下文)

    https://blog.csdn.net/qq_20757489/article/details/88543252 https://blog.csdn.net/pythias_/article/de ...