本文介绍了如何使用HTML和JavaScript实现在鼠标悬停时出现并移开消失的固定提示层，同时提供了一种动态变化文案的函数封装方法。通过实例展示了如何在多个位置应用此功能，并详细讲解了代码实现原理和调用方式。
1.提示层在鼠标经过的情况下出现，鼠标移开消失，且需提示的文案是固定写死的，不需要动态改变的
html:
js:
var layer_tips = 0;
$(document).on('mouseenter', '#layui-layer-tips', function () {
layer_tips = layer.tips('我是固定文案！', '#layui-layer-tips', {
time: 0,
tips: 3
});
}).on('mouseleave', '#layui-layer-tips', function () {
layer.close( layer_tips);
});
2.这里是如果页面中有多处需要提示层的地方，且文案是需要动态变化的，封装成函数调用
html:
js：
var layerTips = function (obj,cl) {
var tip_index;
var msg = $(obj).attr('data-tips');
if(!cl){
tip_index = layer.tips(msg, obj, {
tipsMore: true,
time: 0,
tips: 3
});
}else{
layer.closeAll();
}
}
$(document).on('mouseenter', .layui-layer-tips', function () {
layerTips(this);
}).on('mouseleave', ' .layui-layer-tips', function () {
layerTips(this,1);
});
示例：
html:
js:
var layerTips = function (obj,cl) {
var tip_index;
var msg = $(obj).attr('data-tips');
if(!cl){
tip_index = layer.tips(msg, obj, {
tipsMore: true,
time: 0,
tips: 3
});
}else{
layer.closeAll();
}
}
$(document).on('mouseenter', '.list .layui-layer-tips', function () {
layerTips(this);
}).on('mouseleave', .list .layui-layer-tips', function () {
layerTips(this,1);
});
如图：
2561
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
