将layer的tips弹窗改为滑过显示（layui）

开发主题时使用了layer组件，在做tooltips时发现layer提供的tips弹窗默认是点击后显示的效果，想改成鼠标滑过显示滑出隐藏该怎么实现呢？可以通过mouseenter和mouseleave事件轻松实现。

注意：需要提前引入layer必要的JS和CSS文件

方法参数

首先要了解 layer.tips 方法的参数。

layer.tips(content, follow, options)

• [content] ：（必填）显示的内容可以是字符串，也可以是html代码
• [follow]：（必填）依附的元素，一般用id表示
• [options]：额外参数（可选）tips的配置型[tips位置：1上；2右；3下；4左,字体的颜色]

代码示例

layer.tips(msg, ‘#id’,{tips: 1}，time:10000)

// 这里没有引入layer插件，实际使用前必须引入
<div style="text-align: center;padding:200px 0;">
    <span id="tooltips">鼠标放上来试试</span> 
</div>
<script> 
$(function(){ 
    var tips; 
    $('#tooltips').on({ 
        mouseenter:function(){ 
            var that = this; 
            tips = layer.tips("欢迎访问小菜的IT网https://www.xiaocaiit.cn",that,{tips:[1,'#000'],time:0,area: 'auto',maxWidth:500}); 
        }, 
        mouseleave:function(){ 
            layer.close(tips); 
        } 
    }); 
}) 
</script>

效果如下：