亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

vue 的transition組件會(huì)對(duì)組件內(nèi)的元素進(jìn)行 v-show v-if來進(jìn)行判斷執(zhí)行進(jìn)入動(dòng)畫，離開動(dòng)畫，所以寫好對(duì)應(yīng)的動(dòng)畫後，滑鼠移入顯示，離開隱藏即可

html

<p id="app">
    <p id=ad-box @mouseenter='show =true' @mouseleave='show = false'>
        我是放廣告的父盒子
        <transition name='fade'>
            <p id=ad v-show='show'>我是廣告</p>
        </transition>
    </p>
</p>

css

html, body, #app {
            width: 100%;
            height: 100%;
        }

        #ad-box {
            width: 200px;
            height: 200px;
            position: fixed;
            right: 0;
            bottom: 50%;
            background: #cccccc;
        }

        #ad {
            width: 100%;
            height: 100%;
            background: gray;
        }

        .fade-enter-active, .fade-leave-active {
            transition: opacity .5s
        }

        .fade-enter, .fade-leave-active {
            opacity: 0
        }

要是想從螢?zāi)煌饣M(jìn)來就換一下css樣式就好了，大概就這麼寫