vue页面切换过渡

2024-08-23 16:14:29

<!--<transition name="slide-left">-->
  <router-view></router-view>
<!--</transition>class="child-view"-->

.child-view {
  position: absolute;
  width:100%;
  transition: all .8s cubic-bezier(.55,0,.1,1);
}
.slide-left-enter, .slide-right-leave-active {
  opacity: 0;
  -webkit-transform: translate(50px, 0);
  transform: translate(50px, 0);
}
.slide-left-leave-active, .slide-right-enter {
  opacity: 0;
  -webkit-transform: translate(-50px, 0);
  transform: translate(-50px, 0);}

最新文章

热门文章