layui中添加上下文提示弹窗功能

html部分代码：

<p  context-tip="自定义上下文提示信息">段落内容...</p>
<div  context-tip="自定义上下文提示信息">div内容...</div>

复制代码

js代码部分：

// 悬浮提示
$("body").on("mouseenter", "*[context-tip]",  function () {
    var content = $(this).attr('context-tip');
    this.index = layui.layer.tips('<div >' + content + '</div>', this, {
        time: -1
        , maxWidth: 280
        , tips: [3, '#3A3D49']
    });
});
 
$("body").on("mouseleave", "*[context-tip]", function () {
    layui.layer.close(this.index);
});
 

复制代码

最终实现的效果如下图所示：