当前位置: 代码迷 >> Java Web开发 >> 请问怎么实现鼠标悬停提示框,
  详细解决方案

请问怎么实现鼠标悬停提示框,

热度:7990   发布时间:2013-02-25 21:15:29.0
请教如何实现鼠标悬停提示框,急!!!
当鼠标悬停在某项上时,界面上自动弹出一个小的窗体,里面有一些简单的文字介绍,鼠标移开后,小窗体消失。就像windows系统中,鼠标停在某文件或文件夹的图标上,过一会儿鼠标旁边出现的小提示框一样。请达人提供一个例子,万分感谢!!!!!

------解决方案--------------------------------------------------------
<title=""> 是这个意思吗?HTML里的一个标签
------解决方案--------------------------------------------------------
//在鼠标显示一个层,该层的内容为div1的内容 
function showTip(e,content,ifhave){
//if(!e) e = window.event;
//alert(e);
if(ifhave==null || ifhave=='0')return;
//var div1 = document.getElementById('divdisplay'); //将要弹出的层 
//div1.innerHTML="备注:"+content;
var div1 = document.getElementById(content); //将要弹出的层
var x,x1;
var y,y1;
if(window.event){
e = window.event;
x=(e.clientX+document.body.scrollLeft+10); //鼠标目前在X轴上的位置,加10是为了向右边移动10个px方便看到内容 
y=(e.clientY+document.body.scrollTop+6);
//if((x+400)>document.body.clientWidth){x=x-400;}
if((y+150)>document.body.clientHeight){y=y-150-6;}
}else{
x=(e.pageX+10); //鼠标目前在X轴上的位置,加10是为了向右边移动10个px方便看到内容 
y=(e.pageY+6);
//if((x+400)>document.body.clientWidth){x=x-400;}
if((y+150)>document.body.clientHeight){y=y-150-6;}
}
div1.style.left=x+"px"; //鼠标目前在X轴上的位置,加10是为了向右边移动10个px方便看到内容 
div1.style.top=y+"px";
div1.style.display="block"; //div1初始状态是不可见的,设置可为可见 
//window.event代表事件状态,如事件发生的元素,键盘状态,鼠标位置和鼠标按钮状. 
//clientX是鼠标指针位置相对于窗口客户区域的 x 坐标,其中客户区域不包括窗口自身的控件和滚动条。 
div1.style.position="absolute"; //必须指定这个属性,否则div1层无法跟着鼠标动
}

//关闭层div1的显示 
function closeTip(event,divid) 

//var div1 = document.getElementById('divdisplay'); 
//div1.style.display="none"; 
document.getElementById(divid).style.display="none";
}
------解决方案--------------------------------------------------------
image标签有alt属性可以有文字提示。你要在什么标签上用?
或者用jquery
------解决方案--------------------------------------------------------
不用 复杂的提示框 用alt="就好了啊。"
------解决方案--------------------------------------------------------
加一个alt属性
------解决方案--------------------------------------------------------
HTML code
onmousemove Event  Internet Development Index --------------------------------------------------------------------------------Fires when the user moves the mouse over the object.
------解决方案--------------------------------------------------------
如果是swing,有个setToolTipText方法
------解决方案--------------------------------------------------------
探讨

alt="你的内容"