作者：黄敬定241 | 来源：互联网 | 2024-11-01 07:41
通过优化Vue鼠标悬停触发的弹出窗口组件，实现了在用户将鼠标悬停于目标元素上时，能够高效地展示所有参会人员的姓名信息。此方案不仅提升了用户体验，还确保了数据加载的性能和响应速度。
悬浮弹出所有参会人员
姓名姓名姓名姓名姓名姓名姓名姓名姓名
$w:100vw/1920;
.mouse {position: relative;.hover {max-width: 300*$w;height: auto;position: absolute;left: 280*$w;top: -10*$w;padding: 10*$w;border: 1*$w solid #037ddc;border-radius: 8 * $w;box-sizing: border-box; &::before {content: "";position: absolute;top: 28%;left: -5 * $w;transform: rotate(45deg);rotate: -45deg;width: 10 * $w;height: 10 * $w;border: 1*$w solid #037ddc;border-top: 0;border-right: 0;background: #fff;}}}
效果图：
京公网安备 11010802041100号