鼠标悬浮事件
鼠标悬浮
·
建议:建议使用jquery用法。
原因:原生js用onmouseover 和onmouseout ,假如你的div id为colorFlag下面存在子div id为flag,那么你给colorFlag加悬浮事件的时候,鼠标悬浮的时候会弹出2次,因为原生js会给子默认也加上,jquery的话就解决了这个问题,只需要你使用mouseenter和mouseleave,就不会出现这种问题
1、利用原生js实现鼠标悬浮事件
var tip_index = 0;
var oDiv = document.getElementById('colorFlag');
// 鼠标划过事件
oDiv.onmouseover = function (){
// 3.事件处理程序
tip_index =layer.msg(excepetionData[j].error_msg)
}
// 鼠标移开事件
oDiv.onmouseout = function (){
// 3.事件处理程序
layer.close(tip_index);
}
2、利用jquery实现鼠标悬浮事件
var tip_index = 0;
$("#"+id1+'colorFlag').mouseenter(function(e){
//这里的e可以拿到鼠标悬浮行的整行数据(e.currentTarge)
tip_index =layer.tips('我是悬浮内容',"#"+id1+'colorFlag',{
// area:["200px","auto"],
tips:1, // 在标签上面显示tips
time:100000 // 消失时间
})
}
});
$("#"+id1+'colorFlag').mouseleave(function(){
layer.close(tip_index);
});
更多推荐
已为社区贡献3条内容
所有评论(0)