首页 > vuejs 鼠标划上去显示,离开时隐藏?

vuejs 鼠标划上去显示,离开时隐藏?


这种写法会造成元素一直闪


这个你直接用css实现吧…

button {
    display: none;
}

button:hover {
    display: block;
}

如果硬要用js实现的话,那应该这么写:

<button class="bi-btn btn-primary bi-btn-end detail" v-on:mouseenter="dataDetails($parent.$index)" v-on:mouseleave="hiddenDetail($parent.$index)"></button>

但是诚然,css写不是更简单么?如果就是一个单纯的hover


你这写法不好看..可以使用transition,配合animate.css,这个有很多效果可以在线看供你选择,写法也很优雅.


可以参照


不知道你是否需求想做成bootstrap的popover效果。

你可以参考下面做法

鼠标移入移出效果

【热门文章】
【热门文章】