阅读背景:

048——VUE中使用animate.css动画库控制vue.js过渡效果

来源:互联网 
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>使用animate.css动画库控制vue.js过渡效果</title>
    <script src="vue.js"></script>
    <link rel="stylesheet" href="/go.html?url=animate.css">
</head>
<body>

<div id="hdcms">
    <button @click="type=!type">显示/隐藏</button>
    <transition enter-active-class="animated fadeOutDown" leave-active-class="animated fadeInDown">
        <h1 v-if="type">https://www.baidu.com百度一下就知道</h1>
    </transition>
</div>

<script>
    new Vue({
        el: "#hdcms",
        data:{
            type:false
        }
    });
</script>
</body>

</html>
<!DOCTYPE html>
<html lang="en">

<head>
  



你的当前访问异常,请进行认证后继续阅读剩余内容。

分享到: