vue2+elementui进行hover提示的使用 vue2+elementui进行hover提示的使用

【vue2+elementui进行hover提示的使用】vue2+elementui进行hover提示分为外部和内部，内部使用el-tooltip，外部使用mouseover和mouseout来让提示框显隐(两个事件要做节流处理，事件要在beforedestroy中销毁）

.list-wrap{background-color: #42b983; }h1,h2 {font-weight: normal; }ul {list-style-type: none; padding: 0; }li {display: inline-block; margin: 0 10px; }a {color: #42b983; }

展示效果如下：

文章图片

hover外部：

文章图片

hover里面span：

文章图片

扩展：如果是简单的hover提示文字（单行或者多行），可以使用::hover伪元素来实现，但是如果要使用html中属性值作为提示值，添加\A不能换行

到此这篇关于vue2+elementui进行hover提示的使用的文章就介绍到这了,更多相关vue2 element hover提示内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！