标签:属性 city vue transform nbsp nim logs ade animate
vue有自带动画这个属性:
在需要动画的元素外围包裹上标签,同时用name 属性表明动画的类型
<transition name="toggle-cart"> <div class="shopcart_detail " v-show="listShow"> </div> </transition> <transition name="fade"> <div class="list_masck animated fadeIn" v-show="listShow"></div> </transition>
css中动画的写法很简单
/** 动画 **/ .toggle-cart-enter-active, .toggle-cart-leave-active { transition: all .3s ease-out; } .toggle-cart-enter, .toggle-cart-leave-active { transform: translateY(100%); } .fade-enter-active, .fade-leave-active { transition: opacity .5s; } .fade-enter, .fade-leave-active { opacity: 0; }
标签:属性 city vue transform nbsp nim logs ade animate
原文地址:http://www.cnblogs.com/haonanZhang/p/6950676.html