实现鼠标悬浮效果

1、引入文件 layer.css 、 layer.js
2、参数介绍：
layer.tips(content, follow, options) - tips层
{
content:tooltip内容可以是str，也可以是html代码
follow:依附的元素，一般用id表示
如果依附的元素是自己直接用this即可，如果是在其他元素的事件（比如点击）里面，记得更改this指向。
options:tips的配置型[tips位置：1上；2右；3下；4左,字体的颜色]
}
这3个是必填参数，也同时具有layer的其他基础参数，比如time（是否定时关闭），area（设置框的宽高），shadeClose（是否点击遮罩层关闭）等。

3、代码示例：

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

如果我们不想定时关闭，而是划过显示，划出隐藏的效果，可以配合mouseenter、mouseleave事件即可，此时的time值为0，比如

<div class="content" id="content">
    <label for="">你喜欢的人：</label>
    <input type="text" placeholder="请输入……">
    <i class="iconfont icon-combined-shape-copy tooltip-icon"></i>
</div>
<script type = "text/javascript" src="jquery-1.8.3.min.js"></script>
<script type = "text/javascript" src="lib/layer.js"></script>
<script>
    $(function(){
        var tips;
        $('i.tooltip-icon').on({
            mouseenter:function(){
                var that = this;
                tips =layer.tips("<span style='color:#000;'>这里是提示哦</span>",that,{tips:[2,'#fff'],time:0,area: 'auto',maxWidth:500});
            },
            mouseleave:function(){
                layer.close(tips);
            }
        });
    })
</script>

4、一个页面有多个tips
记得换触发事件的元素、依附的元素、tips定义一次即可。比如：

var tips;
$('i.drug-tooltip-icon1').on({
       mouseenter:function(){
           tips =layer.tips("<span style='color:#000;'>我喜欢阿毛</span>","#id1",{tips:[3,'#ddd'],time:0,area: 'auto',maxWidth:500,tipsMore:true});
       },
       mouseleave:function(){
           layer.close(tips);
       }
   });
   $('i.drug-tooltip-icon2').on({
       mouseenter:function(){
           tips =layer.tips("<span style='color:#000;'>我喜欢阿怪</span>","#id2",{tips:[3,'#ddd'],time:0,area: 'auto',maxWidth:500,tipsMore:true});
       },
       mouseleave:function(){
           layer.close(tips);
       }
   });

一、相关参数：
1、tips - tips方向和颜色
tips - tips方向和颜色
类型：Number/Array，默认：2
tips层的私有参数。支持上右下左四个方向，通过1-4进行方向设定。如tips: 3则表示在元素的下面出现。有时你还可能会定义一些颜色，可以设定tips: [1, ‘#c00’]

2、layer.tips(content, follow, options) - tips层

3、time参数
time - 自动关闭所需毫秒
类型：Number，默认：0 不会自动关闭
默认不会自动关闭。当你想自动关闭时，可以time: 5000，即代表5秒后自动关闭，注意单位是毫秒（1秒=1000毫秒）

layer.tips定义弹出的颜色和宽度

layer.tips('xxx', '.onlinetest', {
    tips: [1, '#3595CC'],
    area: ['500px', 'auto'],
    time: 4000
});

layui的icon