关于鼠标旁边出现提示消息的JS...
当在网页中把鼠标放在一个图片或者一段文字(不是超链接)上的时候(即触发onMouseOver事件)，在鼠标的左下方出现一个提示消息，当onMouseOut，提示框消失，谁有这样的JS，请把代码共享出来大家共享。。。
我在网上找了很多，大多只在IE下面能够显示，但是在FireFox下面就不能实现...
我想肯定有人能兼容这两种浏览器吧，求能够兼容的代码....
[解决办法]
<a href= "# " title= "area "> a </a>
<img src= "http://www.csdn.net/Images/logo_csdn.gif " title= "csdn " />
[解决办法]
手头没有兼容性好的
event在FireFox中要显式传过去才能用
[解决办法]
<html>
<head>
<title> 提示菜单 </title>
<script>
var x,y
function canMove()
{
x=document.body.scrollLeft+event.clientX
y=document.body.scrollTop+event.clientY
}
function move()
{
tips.style.posLeft=x+10;
tips.style.posTop=y+10;
setTimeout( "move() ",10);
}
function showTips(content,obj)
{
obj.innerText=content+ "\t\t\t\t\t\t ";
obj.filters.alpha.opacity=100;
}
function hideTips(content,obj)
{//more javascript from http://cfan.net.cn
obj.innerText=content;
obj.filters.alpha.opacity=0;
}
document.write( " <div id=tips style= 'filter:alpha(opacity=0);position:absolute;background-color:#f3f3f3;font-size:9pt;color:#6c6c6c;border:#d9d9c6 1px solid; '> </div> ");
</script>
</head>
<body onload= "move() " onmousemove= "canMove() ">
<table cellspacing=0 cellpadding=0 border=0 width=760 align=center>
<tr>
<td height=40>
<a href= "# "> <span onmouseover= "showTips( '魔鬼列车最新版本最新上传 ',tips) " onmouseout= "hideTips( ' ',tips) "> 1 </span> </a>
</td>
</tr>
<tr>
<td height=40>
<a href= "# "> <span onmouseover= "showTips( '你好世界 ',tips) " onmouseout= "hideTips( ' ',tips) "> 2 </span> </a>
</td>
</tr>
<tr>
<td height=40>
<a href= "# "> <span onmouseover= "showTips( '你好世界 ',tips) " onmouseout= "hideTips( ' ',tips) "> 3 </span> </a>
</td>
</tr>
<tr>
<td height=40>
<a href= "# "> <span onmouseover= "showTips( '你好世界 ',tips) " onmouseout= "hideTips( ' ',tips) "> 4 </span> </a>
</td>
</tr>
<tr>
<td height=40>
<a href= "# "> <span onmouseover= "showTips( '你好世界 ',tips) " onmouseout= "hideTips( ' ',tips) "> 5 </span> </a>
</td>
</tr>
</table>
</body>
</html>
[解决办法]
<html>
<head>
<title>
dfjk </title>
</head>
<body>
<div id= "div_Tip " style= "BORDER-RIGHT: #666699 1px solid; BORDER-TOP: #666699 1px solid; DISPLAY: none; PADDING-LEFT: 10px; Z-INDEX: 500; LEFT: 448px; VERTICAL-ALIGN: baseline; BORDER-LEFT: #666699 1px solid; WIDTH: 150px; COLOR: #000000; PADDING-TOP: 10px; BORDER-BOTTOM: #666699 1px solid; POSITION: absolute; TOP: 240px; HEIGHT: 50px; BACKGROUND-COLOR: #efeff9; TEXT-ALIGN: left " width= "100px " name= "div_Tip "> aaaaaaaaaaaaaaaaaaa <br> </div>
<div onmouseout= "HideTip(event) " onmouseover= "ShowTip(event) "> ccccccccccccc </div>
<script>
function ShowTip(a)
{
var event=a?a:window.event;
var mX = event.x ? event.x : event.pageX;
var my = event.y ? event.x : event.pageY;
document.getElementById( "div_Tip ").style.display = 'block ';
document.getElementById( "div_Tip ").style.left=mX +10 ;
document.getElementById( "div_Tip ").style.posTop=my + 10;
}
function HideTip(a)
{
document.getElementById( "div_Tip ").style.display = 'none ';
}
</script>
</body>
</html>
[解决办法]
忽忽。
他手误写错了。。。改成这个就可以了。
var my = e.y ? e.y : e.pageY;