ASM said:
Not in Firefox - clientX/Y are for IE and sycophants. Try the
following, it finds the cursor position using the quirksmode reference I
quoted earlier:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"
http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Demo</title>
<style type="text/css">
..toolTip {
border: 1px solid #999999;
background-color: #dddddd;
position: absolute;
padding: 1px 5px 1px 5px;
}
..buttonSet {
font-family: arial, sans-serif;
color: #336699;
background-color: #ffffff;
float: left;
border: 1px solid #999999;
}
</style>
<script type="text/javascript">
// The tool tip is created and referenced as a global object
var tipDiv;
function genToolTip()
{
if (document.createElement) {
tipDiv = document.createElement('div');
document.body.appendChild(tipDiv);
tipDiv.appendChild(document.createTextNode('initial text'));
tipDiv.className = 'toolTip';
tipDiv.style.display = 'none';
}
}
window.onload = genToolTip;
function showTip(e, txt)
{
if ( tipDiv ) {
var e = e || window.event;
var xy = cursorPos(e);
tipDiv.firstChild.data = txt;
tipDiv.style.left = (xy[0] + 5) + 'px';
tipDiv.style.top = (xy[1] + 15) + 'px';
tipDiv.style.display = '';
}
}
function hideTip()
{
if ( tipDiv ) {
tipDiv.style.display = 'none';
}
}
// Based on quirskmode 'get cursor position' script
function cursorPos(e){
if (e.pageX || e.pageY) {
return [ e.pageX, e.pageY ];
} else if (e.clientX || e.clientY) {
return [
e.clientX + document.body.scrollLeft,
e.clientY + document.body.scrollTop
];
}
}
</script>
</head>
<body>
<div>
<a href="#"
onmouseover="showTip(event,'customisable tool tip')"
onmouseout="hideTip()">Mouse over the tip</a>
</div>
</body></html>
