Random fun stuff with layers!

[Malcolm]

Everythings fully commented, just thought I share :)


<!-- In this example I will have a layer following behind the
mouse cursor telling you the co-ordinates of the mouse -->
<!-- The layer -->
<div id="ok" style="position:absolute; font-size:10px; background-color:#dddddd;"></div>
<script language="JavaScript" type="text/javascript">
//check if we're using IE or a real browser
ie=document.all
//When the mouse moves call the function Movin
document.onmousemove = Movin

//The function Movin, argument e holes the current event
function Movin(e)
{
if(ie)
{
//Change the inside of the div to be the X & Y of the mouse (for IE)
document.getElementById('ok').innerHTML = "X: " + eval(event.clientX + document.body.scrollLeft)+"<br>Y: " + eval(event.clientY + document.body.scrollTop);
//This one enter the X & Y of the div itself
//document.getElementById('ok').innerHTML = document.getElementById('ok').style.top+" "+document.getElementById('ok').style.lef t
//Here we chnage the top & left of the div so it apears behind the mouse
document.getElementById('ok').style.top = (event.clientY+18)+"px"
document.getElementById('ok').style.left = (event.clientX+9)+"px"
}
else
{
//Everything below is the same as above but .COM
//browsers don't have the global 'event' thingy, so
//we use 'e' for the event holder!

document.getElementById('ok').innerHTML = "X: " + eval(e.clientX + document.body.scrollLeft)+"<br>Y: " + eval(e.clientY + document.body.scrollTop);
//document.getElementById('ok').innerHTML = document.getElementById('ok').style.top+" "+document.getElementById('ok').style.lef t
document.getElementById('ok').style.top = (e.clientY+18)+"px"
document.getElementById('ok').style.left = (e.clientX+9)+"px"
}
}
</script>
<!-- Poop, that's all! -->