鼠标移动到元素弹出层,离开元素隐藏层

在需要实现功能的地方绑定实现 onmouseover="ShowPrompt(this)" onmouseout="HiddenPrompt()" 一个用于弹出层,一个用于隐藏层

编辑一个div用作层,以便显示内容

这里是层显示的内容

js事件代码,用来触发层的显示和隐藏

//传入 event 对象,获得元素的坐标以便更好的设置弹出层的位置

function ShowPrompt(objEvent) {

var divObj = document.getElementById("promptDiv");

divObj.style.visibility = "visible";

divObj.style.left = getLeft(objEvent) + 0 + 'px';

divObj.style.top = getTop(objEvent) + 30 + 'px';

}

//隐藏提示框

function HiddenPrompt() {

divObj = document.getElementById("promptDiv");

divObj.style.visibility = "hidden";

}

//获取元素的纵坐标

function getTop(e){

var offset=e.offsetTop;

if(e.offsetParent!=null) offset+=getTop(e.offsetParent);

return offset;

}

//获取元素的横坐标

function getLeft(e){

var offset=e.offsetLeft;

if(e.offsetParent!=null) offset+=getLeft(e.offsetParent);

return offset;

}