动画放大缩小的效果出不来，谷歌浏览器

来源：5-2 在Vue中使用 animate.css 库

qq_狂风之中嘶吼_puxWY4

2018-10-11

	<style>
		@keyframes myfirstanimation {
			0% {
				transform: scale(0);
			}
			50% {
				transform: scale(5);
			}
			100% {
				transform: scale(1);
			}
		}
		.fade-enter-active {
			transform-origin: left center;
			animation: myfirstanimation 3s;
		}
		.fade-leave-active {
			transform-origin: left center;
			animation: myfirstanimation 3s reverse;
		}
	</style>
	<div id='root'>
		<transition name="fade">
			<span v-show='show'>Hello World!</span>
		</transition>	
		<button @click='show=!show'>切换</button>
	</div>
	时间是延迟了，但是放大缩小的效果没出来

写回答

1回答